纯css实现div左右等高原理很简单,看了就知道主要使用margin负值+padding正值来实现,外层超出隐藏就ok了
具体看实例
<!DOCTYPE html> <html> <head> <meta charset=utf-8" /> <title>纯css实现div左右等高</title> <style type="text/css"> *{ margin:0; padding:0; } #wrap{ overflow:hidden; width:1000px; margin:0 auto; } #left,#center{ margin-bottom:-10000px; padding-bottom:10000px; } #left{ float:left; width:250px; background:#00FFFF; } #center{ float:left; width:500px; background:#FF0000; } </style> </head> <body> <div id="wrap"> <div id="left"> <p>left</p> <p>left</p> <p>left</p> <p>left</p> <p>left</p> </div> <div id="center"> <p>center</p> <p>center</p> <p>center</p> <p>center</p> <p>center</p> <p>center</p> <p>center</p> <p>center</p> <p>center</p> <p>center</p> </div> </div> </body> </html>
转载请注明:半叶寒羽
» 纯css实现div左右等高