Home >Web Front-end >HTML Tutorial >CSS DIV nested at the bottom of each layer_html/css_WEB-ITnose
I found a lot of examples on the Internet, but it was not feasible. Then I found it in a csdn post and recorded it.
Be sure to set
style="position:relative;"
Rendering:
CSS:
div{border:1px solid black;}#content{height:100%;}#left{width:20%;height:100%;float:left;position:relative;}#right{width:78%;height:100%;float:right;position:relative;}#bottom{width:100%;position:absolute;bottom:0;}
HTML:
<div id="content" name="content"> <div id="left" name="left"> <div id="top" name="top">图片</div> <div id="bottom" name="bottom">底部</div> </div> <div id="right" name="right">右边 <div id="top" name="top">图片</div> <div id="bottom" name="bottom">底部</div> </div></div>