CSS: Div定位不正确
CSS: Div定位不正确
提问于 2010-06-02 04:40:03
我已经在下面上传了我屏幕的一部分
它是论坛的一部分，所以它上面和下面都有元素。"Response Request..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>日期选择器插入脚本标记，这是否会导致问题。可能不会。
firebug计算出的css如下所示。当前唯一不同于继承的样式是display:inline ..我尝试了float，clear，margin等，但都没有成功。所以为了清楚起见去掉了它们。
datePicker :
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 none
-moz-box-sizing content-box
Other
cursor auto
list-style-image none
list-style-position outside
list-style-type disc
marker-offset auto计时器：
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回答 3
Stack Overflow用户
回答已采纳
发布于 2010-06-02 04:47:04
不是浮动的div总是会把下一个内容压到它自己下面。您可以尝试在div上设置display:inline，或者将其设置为span。
Stack Overflow用户
发布于 2010-06-02 04:44:20
您应该将这些div-boxes显示为内联元素：
.datePicker, .timepicker {
display: inline;
}Stack Overflow用户
发布于 2015-02-26 07:57:31
display: inline;应该可以解决您的问题。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/2953152
复制相关文章
相似问题