[英]How can I vertically center text in two side by side divs?
感謝您閱讀本文。
我有類似於下面的標記。 當只有一行文本時使用行高，但是注釋數據通常是多行的。 使標簽和數據垂直居中的最佳方法是什么？
<html>
<head>
<style>
body {margin:0; padding:0; font-size:12px; font-family:Verdana; text-align:center;}
body {text-align: -moz-center; } /* For Firefox */
.record {width:760px; text-align:left; }
.label {float:left; width:125px; line-height:75px;}
.data {float:left; margin-left:10px; line-height:75px;}
.clear {clear:left;}
</style>
</head>
<body>
<div class="record">
<div class="label">Subject:</div>
<div class="data">This is the subject</div>
<span class="clear"></span>
<div class="label">Status:</div>
<div class="data">This is the status</div>
<span class="clear"></span>
<div class="label">Comments:</div>
<div class="data">These are the comments</div>
<span class="clear"></span>
</div>
</body>
</html>
http://www.jakpsatweb.cz/css/css-vertical-center-solution.html
而且當然：
:)
桌子有它們的位置; 但是在嘗試回到表之前嘗試計算如何在div中做某事是很好的。 這樣，當你不能在表格中做某事時，你就會立即知道如何在div中做到這一點。 除此之外 - 雖然它們可能比表格更復雜，但一旦你知道如何，它們就可以讓你的設計具有更大的靈活性。
您可能想要使用的是數據的<table>結構。 雖然有很多文件流傳着說“桌子很糟糕;從不使用桌子”，但桌子顯然是正確的結構，因為它們可以很容易地實現你正在尋找的視覺效果，並且（從我所知道的）你正在呈現表格數據。
我閱讀了教你如何用DIV做到這一點的解決方案。 當我遇到類似的問題時，我只是使用了一張桌子，使用它對我來說看起來不那么混亂和優雅。
我認為至少在這種特殊情況下使用表格沒有任何問題。
將兩個div對齊，然后將兩個div水平和垂直居中
[英]Align two divs to be side by side and then center both divs horizontally and vertically
如何相對於該div垂直居中div兩側的兩個跨度？
[英]How can I vertically center two spans on either side of a div, relative to that div?
無論大小大小，兩個並排div垂直居中
[英]Center content of two side-by-side divs vertically no matter what size content
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.