jQuery Datepicker Width

2019-06-19 23:13发布

问题:

I don't understand why this is so hard to do. Everything about jQuery is so simple. How do you set the width of a jQuery "display: inline;" Datepicker?

I have edited the jquery ui css but as soon as I change the month it resets the width.

I hope this is just something dumb that I'm missing.

回答1:

If you are using the jQuery datepicker in its default form, then just add this to your css and it should work:

.ui-datepicker {
width: 17em; /*what ever width you want*/
}


回答2:

Reducing the font size of the calendar will reduce the width of the date picker.

You can reduce the font size by adding this css:

div.ui-datepicker
{
    font-size:10px;
}


回答3:

.container {
  width: 270px;
}
<div class="container">
  <div class='col-md-5'>
    <div class="form-group">
      <div class='input-group date' id='datetimepicker6'>
        <input type='text' class="form-control" />
        <span class="input-group-addon">
          <span class="glyphicon glyphicon-calendar"></span>
        </span>
      </div>
    </div>
  </div>
</div>