I have a div which contains the entire contents of my page. Inside this div, I added another div for the header and another for content. However, when the content width exceeds the width of my window, I have a problem.
Style:
HTML Code:
:
body
{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color :#ffffff;
}
div.pageAllContent
{
width :100%;
}
div.pageAllContent div.pageHeader
{
background-color :#000000;
border-bottom : solid 1px #000000;
height :70px;
width :100%;
}
div.pageAllContent div.pageMiddleContent
{
width :100%;
padding :0px 10px 0px 10px;
}
HTML:
HTML Code:
<div class="pageAllContent">
<div class="pageHeader">
</div>
<div class="pageMiddleContent">
<!-- Here, put a table that is wider than window -->
</div>
</div>
With this snippet, the black of my header ends with the width of the window instead of stopping with the breadth of its content. I tried all sorts of CSS properties (margin, overflow, etc. ...) but I found nothing.
Bookmarks