不能垂直对齐div答案

【问题标题】：Can't vertically align divs不能垂直对齐div
【发布时间】：2013-12-10 11:12:18
【问题描述】：

我遇到了一个问题，我似乎无法让一些 div 很好地排列。它是否在手风琴中（就像它一样）并不重要。手风琴没有什么不同。这是它现在的作用：

我认为很明显我希望它们在顶部垂直对齐（因为有些比其他长）如果你能出来，那就太好了。

我尝试了它，但失败得很惨，所以如果你想看到它的实际效果，你可以在http://thephotoshopwirral.com/covers.php找到它

如果您需要更多信息，请尽管询问。我会尽力帮助你的。

【问题讨论】：

您是否验证了 HTML？您是否关闭了 label 元素？
您将所有<label>s 嵌套在另一个中。
你有一个 html 混乱。您未能关闭一些 html 标签。
你的意思是水平对齐，对吧？您希望它们沿顶部对齐。这样顶部的 horizontal 行应该是齐平的。水平方向。
我说垂直是因为我希望它们在同一垂直线上对齐，vertical-align 属性就是这样做的。

标签： javascript jquery html css vertical-alignment

【解决方案1】：

标签之间有<br> 标签。删除它们。

<label><br><label>

【讨论】：

他还将它们包裹在一个不必要的主标签内。
他还指出它们应该垂直对齐，这意味着在从上到下运行的列中一个接一个，而不是从左到右运行的行。我认为他们只是不知道水平和垂直是什么意思，但这是一个值得注意的点。
@GrantThomas <label> 默认为 display: inline，因此一旦 OP 更正了错字，它应该可以工作。

【解决方案2】：

您没有关闭 label 元素。我建议验证您的 HTML。

您也不能将div 元素放在label 元素中。我建议重组。

【讨论】：

仅仅因为“它有效”并不意味着它是对 HTML/结构的滥用。它在语义上仍然是错误的。

【解决方案3】：

您打开的是新标签，而不是关闭 <label> 标签：

<label><div class="phoneitem">
    <img src="http://www.thephotoshopwirral.com/image/phones/bold.png" width="200" height="250" alt=""/>
    <input type="radio" name="phones" value="1" id="phones_">
    Blackberry Bold         
</div><label> <!-- THIS LINE -->

将指定行中的<label>替换为</label>。

【讨论】：

是的，这只是一个错字。我尝试了各种方法使其无法正常工作，当我将其恢复到原来的样子时，我忘记了结束标签标记中的“/”。