IE7 did show my navbar horizontally instead of vertically. Searching the web I found an excellent solution on stackoverflow: IE7 does not understand display: inline-block Everything worked fine with IE7 - navbar appeared horizontally - but with addition of the IE7 script appearance of IE8 is completely abolished (blank page) - if I remove the script IE8 is working fine again.
So this is the script I add to the head section:
<!–-[if IE 7]>
<link rel="stylesheet" href="ie7.css" type="text/css" />
<![endif]–->
and this the corresponding stylesheet:
ie7.css:
nav ul li {
display: inline-block;
*display: inline;
zoom: 1;
}
the stylesheet for the nav
main.css:
nav {
font-family:'freestyle script', sans serif;
font-weight:1000;
background-color: transparent;
text-align:left;
display:block;
}
nav ul {
list-style: none;
margin: 0px 0px 0px -15px;
}
nav ul li {
float: inside;
display: inline-block;
border-radius: 20px;
margin: 23px;
padding: 0px 23px 0px 0px;
}
What is the explanation for this unexpected problem with IE8. And is there a solution to get IE8 working again.