CSS 垂直对齐不适用于浮点数
我怎样才能使用
, 和
在财产中
?
如果我不使用完美的工作
. 但是如果我使用浮子，它就不起作用。 使用我很重要
对于最后一个div。
如果你从所有人中删除浮子，我正在尝试遵循 div, 它会很好：
CSS
:
http://jsfiddle.net/J5Ujj/1/
vertical-align
, 和
float
在财产中
div
?
vertical-align
如果我不使用完美的工作
float
. 但是如果我使用浮子，它就不起作用。 使用我很重要
float:right
对于最后一个div。
如果你从所有人中删除浮子，我正在尝试遵循 div, 它会很好：
<div class="wrap">
<div class="left">First div, float left, has more text.</div>
<div class="left2">Second div, float left </div>
<div class="right">Third div, float right</div>
</div>
CSS
:
.wrap{
width: 500px;
overflow:hidden;
background: pink;
}
.left {
width: 150px;
margin-right: 10px;
background: yellow;
float:left;
vertical-align: middle;
display:inline-block
}
.left2 {
width: 150px;
margin-right: 10px;
background: aqua;
float:left;
vertical-align: middle;
display:inline-block
}
.right{
width: 150px;
background: orange;
float:right;
vertical-align: middle;
display:inline-block
}http://jsfiddle.net/J5Ujj/1/
没有找到相关结果
已邀请:
3 个回复
石油百科
赞同来自:
http://jsfiddle.net/VBR5J/
/
</div>
<div class="answer_text">
编辑：
财产
https://developer.mozilla.org/ ... align
CSS 指定垂直元素对齐 inline, inline-block 或者 table-cell.
阅读本文
http://phrogz.net/CSS/vertical-align/index.html
</div>
<div class="answer_text">
垂直对齐真的不适用于浮动元素。 这是因为 float 从文档的正常流程提出元素。
您可能想要使用其他垂直对齐方式，例如，基于 transform, display: table, absolute positioning, line-height, js /也许在极端情况下/ 甚至是通常的旧 html table /也许如果内容实际上是表格的第一选择/. 你会看到它是关于这个问题的热门辩论。
但是，这就是如何垂直对齐的 YOUR 3 divs:
.wrap{
width: 500px;
overflow:hidden;
background: pink;
}
.left {
width: 150px;
margin-right: 10px;
background: yellow;
display:inline-block;
vertical-align: middle;
}
.left2 {
width: 150px;
margin-right: 10px;
background: aqua;
display:inline-block;
vertical-align: middle;
}
.right{
width: 150px;
background: orange;
display:inline-block;
vertical-align: middle;
}
我不知道为什么需要固定宽度，以及显示：内置块，浮动。
</div>
卫东
赞同来自:
财产
https://developer.mozilla.org/ ... align
CSS 指定垂直元素对齐 inline, inline-block 或者 table-cell.
阅读本文
http://phrogz.net/CSS/vertical-align/index.html
喜特乐
赞同来自:
您可能想要使用其他垂直对齐方式，例如，基于 transform, display: table, absolute positioning, line-height, js /也许在极端情况下/ 甚至是通常的旧 html table /也许如果内容实际上是表格的第一选择/. 你会看到它是关于这个问题的热门辩论。
但是，这就是如何垂直对齐的 YOUR 3 divs:
.wrap{
width: 500px;
overflow:hidden;
background: pink;
}
.left {
width: 150px;
margin-right: 10px;
background: yellow;
display:inline-block;
vertical-align: middle;
}
.left2 {
width: 150px;
margin-right: 10px;
background: aqua;
display:inline-block;
vertical-align: middle;
}
.right{
width: 150px;
background: orange;
display:inline-block;
vertical-align: middle;
}
我不知道为什么需要固定宽度，以及显示：内置块，浮动。