# Problem with CSS 100% **URL:** \ **Category:** web dev\ **Created:** [November 14, 2007, 3:57pm UTC](https://forum.kirupa.com/t/problem-with-css-100/244130 "2007-11-14T15:57:20Z")\ **Posts on this page:** 1\ **Page:** 1
**Author:** ![sansimian](https://avatars.discourse-cdn.com/v4/letter/s/8dc957/32.png) [@sansimian](https://forum.kirupa.com/u/sansimian)\ **Post date:** [November 14, 2007, 3:57pm UTC](https://forum.kirupa.com/t/problem-with-css-100/244130/1 "2007-11-14T15:57:20Z")
Ok so I got a main container div which is 100% in height. This works fine. I then have a left container for a menu, and a right container for content. I have put the height for these as 100% but it doesn’t work. In side the right container I have three divs, header, content and footer. Can someone take a look and see why the left and right containers aren’t sizing to 100%. Here is my css code: ```auto /* CSS Document */ HTML, BODY { margin: 0px; padding: 0px; height: 100%; width: 100%; background: #A38771; } #mainBody { width: 755px; margin: 0px; padding: 0px; margin-left: auto; margin-right: auto; position: relative; height: 100%; } * HTML DIV#mainBody { height: 100%; } #left { height: 100%; width: 80px; float: left; } #subBody { height: 100%; width: 675px; float:right; } #header { height: 278px; background: url(../images/template_images/index_01.jpg); } #content { background: url(../images/template_images/index_02.jpg); background-repeat: repeat-y; } #footer { height: 24px; bottom: 0px; background: url(../images/template_images/index_03.jpg); } ``` And Here is my HTML code: ```auto The Winston Churchill
Logo_Left
``` Many thanks in advance.