水平對齊CSS與CSS3

Question

這是我的代碼。我做這些div作爲表格單元格

<div class="logo"> 
text 
</div> 

<div class="stats" > 
text 
</div> 

和我的CSS

.logo 
{ 
    display:table-cell; 
    width:420px; 
} 

.stats 
{ 
    display:table-cell; 
    width:200px; 
} 

是否有可能以某種方式排列第一個div的左側和第二個向右，而無需使用浮動？ 或者只是爲了將它們內部的內容與左右對齊？

Answer 1

關於這一點，有許多更清晰的方法比使用表格單元格這樣的不明顯的顯示方法 - 通常您可以使用block,inline或inline-block來完成所需的操作。你在做什麼需要table-cell？

這就是說，有幾件事你可以做。要在這些元素內部對齊文本或內聯內容，它只是text-align - left或right。如果您嵌套div，則可以應用像.logo *{ float: left; }這樣的規則。

我不熟悉的表格單元格顯示的動態，但如果你想要的位置而不使用浮動，通常你left: 0px;和right: 0px;一起做position: absolute;。儘管如此，這有其自身的一系列問題。

Answer 2

在不同的說明中，您可以使用padding和float來創建表的僞效應，並且「padding + margin + constraint div」證明對我來說是最好的對齊屬性......雖然這可能無法解決你的「沒有浮動」問題。