CODEWITHSUNDEEP
jqueryhtmlcssjquery-uiuidatepicker
FastTrack
FastTrack

Reputation: 8980

jQuery UI Datepicker Style Broken

I have a jQuery UI Datepicker object popping up when I click inside a textbox. Here is the HTML:

<tr>
    <td class="label-td"><label for="dateOpen_add">Date Opened</label></td>
    <td><input type="text" id="dateOpen_add" name="dateOpen_add" maxlength="10" size="10" /></td>
</tr>

Here is the jQuery:

$('#dateOpen_add').datepicker({
    dateFormat: 'yy-mm-dd',
    date: $('#dateOpen_add').val(),
    current: $('#dateOpen_add').val(),
    starts: 1,
    position: 'bottom',
    onBeforeShow: function(){
            $('#dateOpen_add').setDate($('#dateOpen_add').val(), true);
    },
    onChange: function(formated, dates){
            $('#dateOpen_add').val(formated);
    }
});

For some reason, the datepicker shows up like this when I click in the dateOpen_add textbox:

Datepicker Messed Up

Also, here is a link to the problem in action: LINK

Anyone know why this is happening?

Upvotes: 1

Views: 2087

Answers (1)

DaveB
DaveB

Reputation: 3083

Your style #selected-folders-table td, th in Global.css (line 97 & 125) is setting the min-width of ALL th elements to 125px

You can rewrite this css selector to #selected-subfolders-table td, #selected-subfolders-table th {...} to make the selector more specific and fix the bug

Upvotes: 2

Related Questions