...

View Full Version : IE showing overflow area



kwilson81
03-03-2005, 10:48 AM
URL: http://www.europc.co.uk/europcdev/home.aspx?ProductDetailID=1&ProductID=5491

I'm creating the rounded background for the sub-menus (purple ones around the sides) with the following css/html:

HTML


<div class="spacer"></div>

<div class="sideObjectHeader">
<div class="sideMenuHeaderLeftDiv"></div>
<div class="sideMenuHeaderRightDiv">
<span id="lblText" runat="server" class="sideMenuHeaderDivText">Text</span>
</div>
</div>

<div class="spacer"></div>


CSS


.sideObjectHeader
{
text-align: left;
font-weight: bolder;
color: #e5e5ea;
vertical-align: baseline;
padding: 0px 0px;
margin: 0px 0px 0px 0px;
height: 18px;
display: block;
}
.sideMenuHeaderLeftDiv
{
background: url(images/css/sideHeaderLeft.gif) no-repeat left top;
height: 18px;
position: relative;
z-index: 150;
width: 7px;
}
.sideMenuHeaderRightDiv
{
background: url(images/css/sideHeaderRight.gif) #444473 no-repeat right top;
height: 18px;
padding: 0px 0px 0px 8px;
position: relative;
top: -18px;
}
.sideMenuHeaderDivText
{
position: relative;
top: 2px;
}


Everything looks okay on FireFox/XP but, in IE/XP, there's an extra bit of whitespace below the sub-title. It looks to me like it's the space left by the moving of the lower div up the way.

I tried setting overflow: hidden but this just resulted in the layout breaking - divs tried to span to 100% for some reason so page gets stretched out horizontally.

Does anyone know of any other way to get rid of the whitespace at the bottom of these?

Thanks,

K

ArcticFox
03-04-2005, 12:34 AM
I'm not quite sure what whitespace you're talking about, but I *think* any extra whitespace can be eliminated by not having a carrage return or spaces in your code;


<span id="lblText" runat="server" class="sideMenuHeaderDivText">Text</span>
</div>
</div>

<div class="spacer"></div>


Should be changed like this;


<span id="lblText" runat="server" class="sideMenuHeaderDivText">Text</span></div></div>

<div class="spacer"></div>


Try that in the area where you're having problems with whitespacing. If it's what I'm thinking, it's a 'bug' in IE/XP...

:thumbsup:

kwilson81
03-04-2005, 10:15 AM
I had tried that to fix it but didn't make any difference. Might be just another IE bug to add to the list. :mad:

ArcticFox
03-05-2005, 09:09 PM
Any chance you could post an image with an arrow locating the problem area? I'm still not sure what part you're looking at.

I'm sure we can solve this. :thumbsup:

kwilson81
03-08-2005, 11:18 AM
Sorry, it's taken a while to reply - was working on another project there. Here's an image showing the difference between IE and FF on the PC/XP:

http://www.atgl14.dsl.pipex.com/misc/damnIE.JPG

I'm still not having any luck fixing it. Maybe by the time I'm done, IE7 will be out and the world will be a better place :rolleyes: .

kwilson81
03-21-2005, 10:31 AM
Just wondering if anyone had any suggestions for this - still not having any luck with it. :(

_Aerospace_Eng_
03-21-2005, 05:19 PM
is that just on a certain page or all of your pages? because its fine for me, maybe clearing your internet cache could resolve the problem?

kwilson81
03-24-2005, 05:01 PM
Managed to get round it by using some of the IE hacks.

Thanks for the help though!

K



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum