<div>---main container <div>---display:none for Search panel on page load width:0 </div> <div>----main content holder on page load width:100% </div> </div>
.page{ margin:0; width:100%; height:100vh; } .page .maincontent{ float:right; width:100%; } .page .pagesidebar { display:none; float:left; width:25%; overflow:hidden; height:100%; background-color:#a4a4a4; border:1px solid black; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; transition: .6s ease opacity,.6s ease transform; }
Quote:a block-level element always takes up the full width available
width:100%
width:auto
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)