Bootstrap datetimepicker中的CSS问题答案

【问题标题】：CSS issue in Bootstrap dateime pickerBootstrap datetimepicker中的CSS问题
【发布时间】：2017-02-10 06:04:18
【问题描述】：

我正在尝试使用引导日期时间选择器让用户选择日期，但这让我很难过。

当我选择月份时，布局看起来不正确。

更新

 <div class="col-md-10  formMargin" style="text-align: right; " role="search">
      <form>
        <input class="searchPlace" id="city" name="city" autocomplete="off" >
            <span class="searchPrice">
               <div class="form-control  form-background-color searchPrice2" style="">  <span >Price</span> </div>
               <div class="selectBox"> 
                   <select class="form-control   custom-dropdownHome">
                      <option label=" "></option>  
                       <option>Free</option>
                    </select>
               </div> 
            </span>

        <div class="input-group date" id="eventDatePicker_0"    style="height:50px;  height: 50px;padding-right: 0px; opacity: 1; width: 14%;  vertical-align: bottom; display: inline-block;  ">

         <input style="width: 60%; padding: 0px; padding-left: 10px; padding-top: 5px;background:transparent;border:none;box-shadow: none; "  placeholder="Date" class="form-control"  type="text"  >
         <span class=" input-group-addon" style="background:transparent;border:none;box-shadow:none;padding-top: 10px; padding-right: 0px;">
              <span class="glyphicon glyphicon-calendar"></span> 
         </span>

       </div> 
        </form>
     </div>

CSS 代码：

.formMargin form{
    margin-bottom: 0px;
    display: inline-block;
    width: 100%;
}
.searchPlace{

    color: black;
    height: 50px;
    font-size: 17px;
    background: rgba(255,255,255,1);
    padding-left: 1%;
    border: none;
    vertical-align: bottom;
    width: 15%;
}
.searchPrice{
    display: inline-block; vertical-align: bottom;width: 13%;
}
.selectBox{
    border:0px;height:50px;width:70%; background:white;box-shadow: none;display:inline-block;float:right;
}
.date{
    font-size:17px;
    //float:right;
    opacity:0.8;
    padding:5px;

}

提前感谢您的帮助！

【问题讨论】：

可能是一些填充问题。
我认为您的其他 css 脚本正在影响日期选择器的 css。请检查 padding 值。这可能会解决你的问题。我以前有这个问题。请检查填充。
粘贴你的代码
可能是某些类重复了..
在浏览器中检查，看看白色容器是否有宽度限制。也许您可能需要将容器宽度设置为 auto 或删除覆盖的宽度属性。

标签： html css twitter-bootstrap bootstrap-datetimepicker

【解决方案1】：

发现问题。

我在自己的 css 文件中更改了 .table。

table { 
    border-spacing: 20px;
    border-collapse: separate;
}

现在它正在工作。感谢大家的帮助。

【讨论】：