0

HTML

<div class="containerDiv">
    <p>Test</p>
    <input type="checkbox" checked="checked" />
</div>

CSS

.containerDiv 
{
    width:600px;
}

.containerDiv p 
{
    margin: 10px 0px 10px 10px;
    float: left; 
    width: 500px;
}

.containerDiv input[type='checkbox']
{
    float: right;
    margin: auto 10px;
}

你好，

我在 p-tag 和输入中有一个带有文本（文本可能很长）的 div。我希望在文本旁边将输入垂直居中，但float: left不起作用margin: auto 10px。

4

4 回答 4

1

您可以将复选框放置在适当的absolute位置并使用top:50%减去复选框高度。所以你不需要float:right这个元素，而是给它一个right位置。看这个演示：http: //jsfiddle.net/4wXuC/1/

于 2013-03-13T11:03:45.930 回答
0

为了给保证金尝试margin: 10px auto;而不是margin: auto 10px;

于 2013-03-13T10:38:53.413 回答
-1 
 <div style="width: 55px;">
<p style="float: left; margin: 0px 0px 10px 10px; width: auto;">Test</p>
<input checked="checked" style="float: right; margin: 5px auto;" type="checkbox">
 </div>
于 2013-03-13T10:33:02.407 回答
-1

使用 label 而不是 p 并将标签的 line-height 设置为输入的总高度。

于 2013-03-13T10:29:43.273 回答