Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/38.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
CSS:Div的位置不正确_Css - Fatal编程技术网

CSS:Div的位置不正确

CSS:Div的位置不正确,css,Css,我已经上传了下面屏幕的一部分 它是论坛的一部分,因此它的上下都有元素。“Response Req..Date”有一个标签、一个日期选择器和两个下拉选择时间控件。我尝试设置datepicker元素的宽度,并设置一个右边距,以便时间选择器位于它旁边。但它总是坐在它下面 <div class="wrapper "> <label for="responseRequiredDate"> Response Required Date <

我已经上传了下面屏幕的一部分

它是论坛的一部分,因此它的上下都有元素。“Response Req..Date”有一个标签、一个日期选择器和两个下拉选择时间控件。我尝试设置datepicker元素的宽度,并设置一个右边距,以便时间选择器位于它旁边。但它总是坐在它下面

<div class="wrapper ">
    <label for="responseRequiredDate">
        Response Required Date
        <span class="indicator">*</span>
    </label>
    <input type="hidden" name="responseRequiredDate" value="struct" /><div class="datetimepicker">
    <div class="datePicker"> 
    </div>        
    <script> ...</script>
    <div class="timepicker"><select ....
    </div> </div>
计时器选择器:

font-family verdana,arial,helvetica,sans-serif
font-size   12.8px
font-weight 400
font-style  normal
color   #222222
text-transform  none
text-decoration none
letter-spacing  normal
word-spacing    0
line-height 20.7833px
text-align  start
vertical-align  baseline
direction   ltr
Background
background-color    transparent
background-image    none
background-repeat   repeat
background-position 0 0
background-attachment   scroll
opacity 1
Box Model
width   auto
height  auto
top auto
right   auto
bottom  auto
left    auto
margin-top  0
margin-right    0
margin-bottom   0
margin-left 0
padding-top 0
padding-right   0
padding-bottom  0
padding-left    0
border-top-width    0
border-right-width  0
border-bottom-width 0
border-left-width   0
border-top-color    #222222
border-right-color  #222222
border-bottom-color #222222
border-left-color   #222222
border-top-style    none
border-right-style  none
border-bottom-style none
border-left-style   none
Layout
position    static
display inline
visibility  visible
z-index auto
overflow-x  visible
overflow-y  visible
white-space normal
clip    auto
float   none
clear   both
-moz-box-sizing content-box
Other
cursor  auto
list-style-image    none
list-style-position outside
list-style-type disc
marker-offset   auto

您应该将这些div框显示为内联元素:

.datePicker, .timepicker {
    display: inline;
}

嗯,一个未浮动的div总是会将下一个内容推到它自己下面。您可以尝试在div上设置display:inline,或将其设置为一个span。

display:inline应该可以解决您的问题。

它不起作用。。虽然我可以在Firebug中看到css的应用,但我在timepicker div上尝试了float:right,并在datepicker上添加了right margin+set width,希望timepicker可以内联,但没有。虽然我在样式后应用了clear,但页面中的其余控件也会向右浮动。。我知道,我遗漏了一些东西,但对我来说并不直观:-(span不起作用,可能是因为时间和日期选择器中都有许多包含的div..您的时间选择器具有clear:All属性集,这使其位于任何前面的元素之下。您可以尝试创建两个块元素(display:block),删除清除属性并添加float:left。您能在屏幕截图中显示用于生成示例的CSS吗?以及您使用的日期选择器和时间选择器吗?谢谢Marcel。CSS如上图所示。日期选择器来自YUI,但时间选择器是自定义呈现的(双选输入).我使用Joda time,所以不确定是否已经有类似的控件可用。除了定位之外,其他都可以工作,我认为定位可以通过css解决。你能在回答中提供更多细节吗?
.datePicker, .timepicker {
    display: inline;
}