html - How to make div blocks not floating using CSS? -
layout.cshtml
<section id="main"> <div id="sidebar"> @{html.renderaction("categorymenu", "store");} </div> <div id="content"> @renderbody() </div> </section>
style.css
... #main { padding: 30px 30px 15px 30px; background-color: #fff; -webkit-border-radius: 4px 0 0 0; -moz-border-radius: 4px 0 0 0; border-radius: 4px 0 0 0; overflow: hidden; } #sidebar { display: block !important; width: 15%; float: left; font: bold 20px arial, verdana; background: green; height: inherit !important; } #content { display: block !important; float:none; } ...
i tried set sidebar's height 100%, inherit. should make 2 blocks not floating each other?
sidebar floating left, taken out of dom flow , set left. if don't want #content appear next need add clear: both #content style. force clear floats around , appear on next line. however, not stop #sidebar floating , there nothing next sidebar.
can clarify trying since setting #sidebar float:left asking how make them not float.
Comments
Post a Comment