Oh dear ie6 prob

Hi folks, I've been trying to figure out the whole div and css positioning thing and I've got to the stage where I'm happy that it's what I want in firefox, but not quite in IE

IE7 & 8 are ok-ish and I'm pretty sure I can sort them out to look the same but in IE6 the top banner bit just looks a bit more fundamentally broken.

I've looked up some known bugs and tried out a few different things but none have worked so far. I don't know much about all this stuff and although I'll keep tinkering if anyone can point me in the right direction I'd be much obliged.

https://www.babyclothingcentral.co.uk

cheers

Is this your own template or one from template monster or as such?

I see you have DBCText, topText, and bottomText etc appearing more than once...... in that case they should be classes rather than Id's

Personally i wouldnt worry that much about it not working qite right in IE6 ....... and it doesnt look too bad.

If you want to use styles that just affect IE6 you will need to do the star html hack ...for example

*html #DBCText
{
....
}

Havnt had a good look at your css and all, but it is usually just width issues.

Scott

ps ... on a side note, it might be a good idea to change the hover effect to a darker colour, as its pretty hard to read!

I notice that the whole string of divs is floated right; but the only ones that float right in IE6 are the ones with a specific width assigned. I think IE6 makes even floated divs 100% width unless otherwise specified. Since you have IE stylesheets, you could add widths to those divs for that browser.

Hey Ooba_Scott, thanks for replying.

It's my own template, hence why those divs that should be classes aren't. But I'm learning... :)

I've got a IE6 stylesheet so I'll start messing around with the widths then. Although I disagree that it looks alrite in IE6, it looks like it's gone crazy to me!.

Hi Glenn, thanks (again). You seem to be on this forum helping out all the time! A true good samaritan.

As above I'll try messing around with widths, hopefully thats just it.

I wonder is it cheeky, since I have the attention of a couple of people who obviously know a lot more than me... on IE6&7 there is a big 20px space between my left column and the middle column. In FF and IE8 its only 5px. I've tried all sorts of paddings and margins on the divs that (I believe) are causing the problem, but to no avail. Any hints?

thanks guys!

I've got the problem in IE6 mostly sorted however there is a white space of 6px between the top banner area and my navMainWrapper underneath it. (in IE6 only)

I've tried a few things I found out from googling bug fixes but haven't come accross anything that works yet.

Also still cant figure out why there is a 20px space between my left column and the middle column in IE6&7 while in FF and IE8 its only 5px.

anybody have any ideas?

Thanks!

I've got the problem in IE6 mostly sorted however there is a white space of 6px between the top banner area and my navMainWrapper underneath it. (in IE6 only)

I've tried a few things I found out from googling bug fixes but haven't come accross anything that works yet.

Also still cant figure out why there is a 20px space between my left column and the middle column in IE6&7 while in FF and IE8 its only 5px.

More than likely they are being caused by Box Model interpretation differences between the browsers.

Your category links in IE6 are extending into the 20px space, so I would look at the link styling.

Basically, I think you can just try tweaks in your IE stylesheet, since it is non-standard interpretation that is causing the differences and probably not any errors in your styling.

Ok we're defo getting somewhere.

Thanks for the pointers about box model problems Kim. I read up and understand the issues now.

And Glenn you were right about it being the links in the categories causing the extra whitespace. So I've managed to sort that problem out.

The box model thing was partly to blame for the horizontal whitespace btween my header and my navmain too. Sorting out the padding and line height took 3px off the 7px problem.

But 4px still remain. through IE webdev tool I can see that no other divs seem to be encroaching on the whitespace. It doesn't seem to be to do with any box model issues.

anybody any other ideas?

thanks