Forum Moderators: open
I am using the overflow style to wrap my container div around its floating elements, and am currently using overflow:hidden without a set height and it is rendering correctly in all browsers except IE7 - It seems as though this change didn't change IE7 at all.
I have tried all variations of the overflow style including removing it altogether with no luck. I am beginning to think that is not the problem, but cannot figure out is causing the scrollbar.
The scrollbar is only appearing in IE7 - and it only scrolls and contains the contents of the div "page" - it makes the scrolling box almost big enough to fit the contents, scrolling inside of the page div just allows you to see more blank space
I would appreciate absolutely any help I am at my wits end.
Thank you for any help...
HTML************************
<div class="hidden">
<!--[if lte IE6]>
<link rel="stylesheet" href="css/IE6.css" type="text/css" media="screen" />
<![endif]-->
</div>
<div class="hidden">
<!--[if IE 7]>
<link rel="stylesheet" href="css/IE7.css" type="text/css" media="screen" />
<![endif]-->
</div>
</head>
<body><!--makes the current page indicated by turning the secondary navigation link white-->
<div id="main"><!--entire site container-->
<div id="page"> <!--where the scrollbar starts-->
<div id="bottomswoop"></div>
<div id="pagecontent"> <!--contains everything to the right of the dotted line-->
<p class="pagecontentonly">We offers a large </p>
<div id="bottompagecontent"> </div> <!--closes bottompagecontent-->
</div> <!--closes pagecontent div-->
<div id="leftside">
<ul>
<li id="general"><a href="contact.html">General Contact Information</a></li>
<li id="customer"><a href="customer-service.html">Customer Service</a></li>
<li id="financial"><a href="financial-services.html">Financial Services</a></li>
</ul>
</div>
</div> <!--closes page div - where the scrollbar ends-->
</div> <!--closemain-->
</body>
</html>
IE7 OVERRIDES STYLESHEET *********************************************
.hidden{
display:none;
}
div#leftside ul {
list-style-type: none;
line-height:2em;
padding-top:0px;
padding-left:0px;
margin-left:25px;
}
div#leftside {
max-width: 190px;
}
div#pagecontent {
max-width:500px;
}
SITE CSS STYLESHEET************************************************
body,html{
background: #002f13;
margin:0;
padding:0;
font-family:Trebuchet MS, Helvetica, sans-serif;
color:#fff;
font-size:11px;
padding-bottom:10px;
}
hr{
margin:20px 0;
}
#main{
margin-right:auto;
margin-left:auto;
width: 710px;
min-height:100%;
position:relative;
color:#fff;
background: #0a4823;
}
/*Affects everything in the light green color on the page*/
#page {
background-color:#659A66;
width:100%;
overflow:hidden;
padding:0px;
}
/*affects every thing to the right of the dotted line*/
#pagecontent {
float:right;
width:510px;
min-height:375px;
padding-bottom:10px;
}
#pagecontent p.pagecontentonly{
padding: 0 20px;
line-height:1.7em;
font-size:110%;
}
