html5 - Content area doesn't stretch over content boxes -
basically have code has content area , in content area had 2 boxes floating away each other. content area has background color of white should cover area of other boxes well, reason doesn't. have tried giving boxes background color of white, background doesn't show up. have tried changing overflow properties of of div statements, didn't either. ideas?
html5
<div class="wrapper"> <div id="content"> <!-- #begineditable "content" --> <h1 class="center">home</h1> <div id="content-box2"> <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. sed posuere sodales justo @ faucibus. integer pharetra sagittis mauris, et sollicitudin arcu rhoncus ut. class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. curabitur adipiscing scelerisque mauris, id adipiscing nulla placerat non.</p> </div> <div id="content-box3"> <p class="align-right">neque porro quisquam est qui <br>neque porro quisquam est qui <br>neque porro quisquam est qui <br>neque porro quisquam est qui <br>neque porro quisquam est qui <br>neque porro quisquam est qui <br>neque porro quisquam est qui</p> </div> <!-- #endeditable --> </div> </div>
css3
body { background-color: gray; color: #202020; font: normal .90em"trebuchet ms", "lucida sans unicode", "lucida grande", "lucida sans", arial, sans-serif; margin: 0; text-align: left; } .wrapper { margin: 0 auto; width: 980px; } #content { background-color: #fffaf0; margin: 2% auto; padding: 10px 25px; width: 88%; } #content-box2 { float: left; padding-left: 80px; width: 40%; } #content-box3 { float: left; padding-right: 80px; width: 40%; } .align-right { text-align: right; }
you using float: left;
wont make div expand, try using display: inline-table;
Comments
Post a Comment