水平对齐

我有一个这样的盒子：水平对齐

<div id="selectBox"> 
Select: 
<select> 
<option>1</option> 
<option>2</option> 
</select> 
</div>

我如何让他们对齐，这样他们在彼此的中间水平，“选择”文本和基线选择框（“1”）的内容（而不是框本身）。

我可以通过包装他们围着一张桌子SOLV此，使两个小区，但我觉得方法很粗糙。我想要什么

视觉例如：看看你的状态栏上方@stackoverflow。它有NAME |注销|关于|常见问题SEARCHBOX。现在：注意文本如何对齐TOP，并且searchfield位于中间（因为它占据了该空间）。我希望文字对齐中间：d我的浏览器ATM是IE7

来源

2010-05-11 Jason94

你的意思是像'[空格]选择：[空格] < 1 > [空格]' ？ – kennytm 2010-05-11 11:09:00

你的代码应该精确地做你想要的。你使用的是什么浏览器？ – 2010-05-11 11:21:49

不，我想让它们水平甚至......就像它们现在一样：“ - _”其中 - 代表“选择”底线，“_”代表选择框的底线 – Jason94 2010-05-11 11:32:36

Editted：

<div id="selectBox"> 
    <label for="select">Select:</label> 
    <select id="select"> 
     <option>1</option> 
     <option>2</option> 
    </select> 
</div>

那么CSS：

#selectBox label 
{ 
    vertical-align:bottom; 
}

见这里：jsFiddle

来源

2010-05-11 11:32:44 tster

我已经编辑我的问题...：（？中间为我工作，所以为什么底部）d读底部 – Jason94 2010-05-11 11:38:59

本书虽然是对齐是错误的标记文本做我想要的！好极了！ – Jason94 2010-05-11 11:58:49

我不知道......请作风漂浮尝试：左到div

 
float:left;

来源

2010-05-11 11:17:45

浮动股利也无济于事。它的内容，我想中间对齐彼此 – Jason94 2010-05-11 11:19:48

不能对齐内的文本选择任何东西。最好的你可以尝试vertical-align不同的值，但恕我直言，它将不可能在不同的浏览器中获得完全相同的对齐方式。

来源

2010-05-11 11:22:07 RoToRa

几乎是不够好，我reccon：d – Jason94 2010-05-11 11:40:13

回答

相关问题