Expanding menu,funny spacing in IE7

kafeinadav / 2010-06-09 22:50:31   

Hi guys...I'v surfed the web and the forum but I'm really going crazy with this and I couldn't find anything
.
Usually I won't bother being perfectly visible and compatible on older browsers (anybody in my business uses Macs) but I've been asked by a recruiter to being viewable even down to Internet Explorer 7.

I'm struggling with my css (after trying different "IF lte IE7" in my index.php without success).
I come to the conclusion that the problem is in my css.

In every browser I tried, the spacing between the links in the menu works well.
My problem appears just on IE7 where the menu bar's height became miles and miles tall.

Maybe it's incredibly simple...

Here's my site url: portfolio2010
And here's the menu part of my css:

/* MENU */

#menu {
z-index:80;
font-size: 9px;
width: 170px;
overflow: auto;
top: 0;
position: fixed;
height: 100%;
}
#menu li {
padding-top: 1px;
text-transform: uppercase;
margin-bottom: 4px;
text-align: left;
display: block;
cursor: hand;
cursor: pointer;
}

#menu li a {
font-family:helvetica, arial, verdana;
text-transform:uppercase;
font-size:9px;
font-weight: bold;
color:#DDDDDD;
padding: 2px 3px 2px 10px;
}

#menu li a:active {
background:url() repeat #9fd311;

}

#menu ul {
list-style: none;
margin: 0px 0px 0px 0px;
}

#menu ul li.section-title {
font-weight:bold;
padding: 0px;
margin: 0px;
}

I hope you can help,
thanks A LOT or your time .
DAvide.

orionrush / 2010-06-10 08:50:42   

Your link isn't correct - benefit of the doubt...

The IF lte IE7 etc conditions only work if they appear after your other styles are loaded.

You have a few choices:

Create a style sheet which is for IE7 only, and load it within your conditional comments after your primary style sheets, thus overriding the aplnilcapable rules when invoked.

In most people's indexhibit implementations the css is external, living in the same directory as your template. An IE 6 conditional style sheet is included with the 'sample' template, with an associated IE6 rule in the template index file.

Note your ie7 style sheet need only contain fixes to rules which are causing you problems.

The other way to go about it is to put *fixes into your main style sheet _rules. These are hacks and not ideal - but if all you need is to tweak one rule. . . .

lots of pages on this stuff:
http://www.webdevout.net/css-hacks
http://snook.ca/archives/html_and_css/targetting_ie7

kafeinadav / 2010-06-10 18:44:52   

Ouch, my bad, the correct link is this: Portfolio

Thanks for your help orionrush! tonight I'll try to do as you suggest. I did put a conditional comment in my index.php, but before the main css call...maybe this is part of the problem.

Also thanks for the links!

This thread has been closed, thank you.