IE6 hack is needed

[monty911]

Hi all!

I'm learning the CSS and I have a problem with my practice page.

This (http://montyx.10gbfreehost.com/proba1/) is my page.

So my problem is, the design is working properly with all of browsers, but IE6. The main div is dropping out from the page div, and not inherit the white background color, and the shadows on the left and the right edge.

I know, how could I make an IE hacking, but I don't know, what I have to put to the iehack.css to solve this problem?

Thank you in advance,

Monty

Ps.: I've bordered the divs to find the problem, and sorry cause my weak english :(

[smyhre]

Have you tried using the clearfix?
http://www.webtoolkit.info/css-clearfix.html
Sorry I didn't take an in depth look at your code but that is what it sounds like you need to use. And at this time I can't experiment and show you what to apply it to.

[Centauri]

#submenu needs display:inline added to prevent IE6's doubled float margin bug (which is pushing things to the right), and #content needs a small height assigned just for IE6 (to force HasLayout so it surrounds the floats) - either a star-html hack could be used, or better still, link the iefix.css file using a conditional comment so only IE6 will see it.

[monty911]

I would like to thank you! ;)

I'm checking your tips, and I will respond you.

[monty911]

Your tips are working!

This is much better now, and I have only 3 problem now:
- the top dark breaker is shorter some pixel than it needs to be (uBreak.jpg)
- the header background is the same too (headerBg.jpg)
- the right shadow is not repeating

This (http://kepfeltoltes.hu/080814/css_www.kepfeltoltes.hu_.jpg) is an image about these issues

I've refreshed the page (http://montyx.10gbfreehost.com/proba1/)!

[Centauri]

The side gaps are due to #pageheader being too wide - the 2px borders ADD to the 100% width. If the borders are only temporary, removing them will fix this, otherwise remove the 100% width.

Where floats need to be surrounded and the overflow:hidden method is used, IE6 won't comply. For these divs (#content and possibly also #pageheader if the width is removed) IE6 only will need height:1% and also overflow:visible so it does not get cut off.

[monty911]

The side gaps are due to #pageheader being too wide - the 2px borders ADD to the 100% width. If the borders are only temporary, removing them will fix this, otherwise remove the 100% width.

Where floats need to be surrounded and the overflow:hidden method is used, IE6 won't comply. For these divs (#content and possibly also #pageheader if the width is removed) IE6 only will need height:1% and also overflow:visible so it does not get cut off.

Hi again. I've tried your tricks. But this isn't working. How could I help you to find the problem? If I link the codes, will be it good? :confused:

Or I could attach the files, if you need'em

[Centauri]

The IE6 only stylesheet is not where the link points. Remove the red highlighted part :<!--[if lte IE 6]><link rel="stylesheet" type="text/css" href="/css/ie.css"/><![endif]-->

[monty911]

The IE6 only stylesheet is not where the link points. Remove the red highlighted part :<!--[if lte IE 6]><link rel="stylesheet" type="text/css" href="/css/ie.css"/><![endif]-->

khmmm... :p

I'm a f... loser! :o
Thanks a lot for your help, and this was the result! Thank you very much!!! :D

[monty911]

Sorry, cause my connection, this reply was duplicated! :(