By Nda on

Hi,

I've ran into a problem with my drupal menu on Internet Explorer 7.
I used clear:both; on the li classes to prevent the menu items from overlapping eachother. This worked for me in FF and IE6 but IE7 ignores it. You can see it in action here:

http://www.wearecamping.nl/logopedie/

I've tried some hacks that I found on the internet like

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {
height: 1%;
}

But they don't seem to work at all. Has anyone here experienced something like this or perhaps knows another way I can get around this? Thanks in advance.

⋅ Categories: Drupal 5.x

Comments

Sverre’s picture

Sverre commented

Hi Nda,
I've just been to your site in FF and IE7 and I can't see any difference!
Did you fix it?

Regards,
Sverre :-)
--
Sverre Sverresonn
Group Scout Leader
21st Medway Scouts, Kent, UK
http://www.21stmedway.org.uk/

Nda’s picture

Nda commented

oh hi :)

I forgot to mention it's when you see expanded leafs.
Check http://www.wearecamping.nl/logopedie/?q=node/42 for example.

artist.lupein’s picture

artist.lupein commented

Try to add min-height:29px; or replace height:29px; with min-height:29px; in style.css in the following selector:

#nda_blocks li.leaf, #nda_blocks li.collapsed, #nda_blocks li.expanded {
    list-style-type: none;
    list-style-image: none;
    list-style-position: inside;
    background: url('images/menu_button.png') no-repeat left top;
    padding: 0px;
    height: 29px;
    width: 168px;
    clear: both;
}

Hope this helps.

----
Lupein
Drupal themes - themeartists.com

Nda’s picture

Nda commented

1000x thanks!
Replacing height with min-height worked like a charm!

Sorry I didn't reply sooner, didn't have time to work on it this weekend.