html - CSS: my side bar overflow the container div's border when I set it's height to 100% -


my side bar overflow container div's border when set it's height 100%, know if there way can have it's height 100% minus px.

here source:

<div id="main">     <br /><br />     <div class="content">         <div id="sidecontent">             <h1 id="title">title</h1>             *****         </div>         <div id="sidebar">             <div class="sidebox">                 ****             </div>         </div>     </div>     <div class="bottom"></div> </div>   #main {         position: relative;     background:transparent url('/public/images/main_bg.png') top left repeat-y;     padding:37px 37px 37px 37px;     margin-left: auto ;     margin-right: auto ;     width:940px;     min-height: 363px;         }         #main div.top, #main div.bottom {         height:70px;         width:1015px;         position: absolute;         left:0px;         }          #main div.content {         padding:0 15px 0 15px;         }          #sidecontent {         width: 675px;         }          #sidebar {                 background: #fff url('/public/images/bg_side.png') top right repeat-y;         position: absolute;         height: 100%;                 right:34px;                 top:42px;         width: 200px;         padding: 10px 10px 0px 40px;                 z-index:50;         }          .created_at {         color:gray;         }                 .sidebox {         margin-bottom: 5px;         }      #main div.top {         top:-70px;         background: transparent url(/public/images/main_top.png) bottom no-repeat;         }      #main div.bottom {         bottom:-70px;         background: transparent url(/public/images/main_bottom.png) top no-repeat;         } 

try having @ article , see if can follow that. describes how have 2 columns same height using css techniques.


Comments

Popular posts from this blog

javascript - Enclosure Memory Copies -

php - Replacing tags in braces, even nested tags, with regex -