                        課程
                    
                        /前端開發
                        
                            /HTML/CSS
                        
                        /如何用CSS進行網頁布局

兩列布局左右高度一致,但要自動

兩列布局,右側的高度是自動的,左側內容較少,要做成和右側一樣的高度,除了position:absolute之外還有沒有其他的辦法?

叮咚尹尹

2015-12-17

源自：如何用CSS進行網頁布局 5-1

關注問題我要回答

2493

操作

收起

2 回答

echo_kinchao
2015-12-17

左右浮動父級定寬就好了

0 回復有任何疑惑可以回復我~

收起回答

慕男嬸
2015-12-17

<!DOCTYPE?html>
<html>
<head>
<meta?charset="UTF-8">
<title>等高列布局</title>
<style>
??*{margin:?0;padding:?0;}
??.row{
????display:?table-row;
??}
??.cell{
????display:?table-cell;
??}
??.left{
????width:?200px;
????height:?300px;
????background:?red;
??}
??.right{
????width:?300px;
????/*右邊的div并沒有設置height，但是他的高度會自動的等于?.left的高度，即300px*/
????background:?green;
??}
</style>
</head>?
?<body>
?<div?class="row">
????<div?class="cell?left"></div>
????<div?class="cell?right"></div>
?</div>
?</body>
</html>