Home/ Questions/Q 3274356
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-17T19:01:43+00:00

I made a form, which extends from Zend_Form , where I added a ZendX_JQuery_Form_Element_Datepicker

  • 0

I made a form, which extends from Zend_Form, where I added a ZendX_JQuery_Form_Element_Datepicker as you can see in this picture:

But when I view that page in the browser, the datepicker seems to work, but the layout is messed up. See this picture:

You can see that the datepicker is too small and the prev/next buttons are not shown correctly. I’ve tried fixing this with css:

.ui-datepicker-div { width: 200px; } 
.ui-datepicker-calendar { width: 200px; }

This helps a little, as you can see in this picture:

But as you can see, there’s still a problem with the prev/next buttons. How I can I fix this?

Update: I fixed my problem by including another css file. Because I was using the Google CDN for jQuery and jQuery UI, I had to use the CDN also for including the css. So, by adding the following line, I solved my problem:

$this->jQuery()->addStyleSheet('http://ajax.googleapis.com/ajax/libs/jqueryui/1.7/themes/smoothness/jquery-ui.css');
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You have some external CSS interfering, something affecting all table cells most likely, possibly <div> and <a> elements as well. Without a link to the actual page I can’t say…but it’s definitely a CSS issue, where your styles are overriding the padding/margins jQuery UI sets.

    • 0