参见英文答案 >
How align 2 adjacent divs horizontally WITHOUT float?5个
我想知道是否存在一个优雅的方式来水平对齐3个div,而不使用float css属性.
我想知道是否存在一个优雅的方式来水平对齐3个div,而不使用float css属性.
HTML：
@H_403_5@<div id="parent"> <div id="first">Left</div> <div id="second">Middle</div> <div id="third">Right</div> </div>解决方法
您可以使用display：inline-block或display：table-cell与内部内容.
> Flex布局(参见T J’s answer)：
@H_403_5@#parent{ display:flex; justify-content: space-between; }>表布局：
@H_403_5@#parent{ display:table; width:100%; } #parent div{ display:table-cell; } #first{ text-align:left; } #second{ text-align:center; } #third{ text-align:right; }>内嵌块布局：
@H_403_5@#parent{ width:100%; white-space:nowrap; } #parent div{ display:inline-block; width:33.3%;} #first{ text-align:left; } #second{ text-align:center; } #third{ text-align:right; }