Site Layout: IE7 messed up site layout

[zitrone]

Hi everybody,

I started my website with CMSMS 0.13 then I upgraded to 1.0.2. Thus, the techniques and stuff are new, but I still use the old stylesheets that got transferred with the upgrade.

Now, IE7 messes it all up. It looks fine in Firefox, in IE6. But IE7 seems to interpret the "display:block" of the header wrong. I know, that cannot be the case, but I cannot find the true problem either. 

Here is a link to my website:

www.blulu.de

Do I have to insert a condition as in the forum topic "Vert Menu Issues with IE7??"

But then, I do not know what code shall be in the file ie7plus.css ...

Any suggestions?

Thank you very much in advance. 

[squigg]

you are still using the "* html" hack

* html #menu_vert li { float: left; height: 1%; }

* html #menu_vert li a { height: 1%; }

this will be correctly parsed in IE7, but because the rendering is different it is likely to break.

you need to use conditional style sheets, one for IE6 and one for everything else (and possibly a separate one for IE7 if you have anything specific for that).

use this code:

Code: Select all

<!--[if IE 6]>
<link href="/css/ie6_only.css" rel="stylesheet" type="text/css" />
<![endif]-->

and add everything with "* html" in front of it into this IE6 sheet and remove it from the normal one. try it again then. i would post the solution but i don't have IE7 on this comp

[cyberman]

Please check your encoding too. Found this in source

And this

Code: Select all

<__html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

should be

Code: Select all

<__html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">

[zitrone]

Hi there,

thank you very much for the advise. I will try to implement it first thing tomorrow.

I hope it works without a specific condition for the IE7. 

[zitrone]

Hello there

The advise to remove the * html hack did not work, or I made a mistake. 

I do not have anything IE7 specific. At least, not that I know of...

I followed the advise from Sqigg and created a stylesheet in which I entered the * html code without the * html:

Code: Select all

#menu_vert li { float: left; height: 1%; }

#menu_vert li a { height: 1%; }

then I and uploaded it onto the server in the designated path: css/ie6_only.css

Then I implemented the conditional reference into the head section of my templates:

Code: Select all

<!--[if IE 6]>
<link href="/css/ie6_only.css" rel="stylesheet" type="text/css" />
<![endif]-->

It did not work.
I also tried it with:

...

No effect.
I figured that there is a global content block called

JavaScript for IE page width

that containes also specific IE6 style definitions. I entered the above code there as well. Nothing happened.

Then I removed the IE6 conditional reference from my template and deleted the IE6 definitions from the global content block to see if there is at all something happening: Yes, it looks even more horrible, but at least a change.

Thus, I guess I need to change something in this global content block?

JavaScript for IE page width

 

Code: Select all

<__script__ type="text/JavaScript">
<!--
//pass min and max -measured against window width
function P7_MinMaxW(a,b){
	var nw="auto",w=document.documentElement.clientWidth;
	if(w>=b){nw=b+"px";}if(w<=a){nw=a+"px";}return nw;
}
//-->
</__script><!--[if lte IE 6]>
<style type="text/css">
#pagewrapper {width:expression(P7_MinMaxW(720,950));}
#container {height: 1%;}
</style>
<![endif]-->

Please, please help. I am totally lost in all these hacks and fixes and browser bugs...

[cyberman]

But IE7 seems to interpret the "display:block" of the header wrong.

Can you post a sreenshot? Cannot install IE7 currently (Win2000) ...

Have you checked if a default install of CMSms 0.13 works fine with IE7?

[zitrone]

HI,

I made a default installation of 0.13 and this is the result in IE7:


Probably everybody knows, but this is how it should look like:



And here my website in IE7:



And in FF:



Any suggestions how this can be solved? I otherwise see only the solution to adapt the standard stylesheet of CMS Made Simple 1.0.2.

 

[cyberman]

Any suggestions how this can be solved? I otherwise see only the solution to adapt the standard stylesheet of CMS Made Simple 1.0.2.

Hmm, css from 1.02 and 0.13 are too different for an easy compare. So I think your solution could be the faster way  ...

[zitrone]

yeah, thanks anyway for all your effort. I reckon it is indeed the fastest thing to adapt the css of version 1.0.2
Thus, I will also learn more. 

cheers!

[taberman]

I have this exact same problem and I'm not really into starting over my whole site. Has anyone figured out where in the old css's and/or templates the problem might be?