(solved) horizontal CSS-menu and IE6 interpretation

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Post Reply
mev
Power Poster
Power Poster
Posts: 371
Joined: Wed Apr 25, 2007 5:00 pm

(solved) horizontal CSS-menu and IE6 interpretation

Post by mev »

Hi, I use the horizontal CSS menu in a site. The position of the secondary menu-item (after collaps) in IE6 is not right, too far to the left, I would like to have it collaps right below the left position of it's parent.
In Firefox it's allright, for IE7 I used a hack (* html), which is interpretated by IE7 correctly, but not by IE 6 !!


It regards this site (in drafting mode yet):
http://www.andreschoots.com/index.php

(secondary menu-items are shown in for instance the primary item "Contact & Links"

May be it's because I also specified a value for the width for the menu items (in #prim-nav li li), which causes the known 'box-problems'??
I tried several other methods to have IE6 behave as wished, incl. conditional comments, nothing seems to work.
It makes me nuts, any suggestion would be very helpfull

Thanks so very much in advance

Willemijn
Last edited by mev on Tue Oct 09, 2007 2:23 pm, edited 1 time in total.
KO
Power Poster
Power Poster
Posts: 562
Joined: Mon Nov 06, 2006 7:55 pm

Re: horizontal CSS-menu and IE6 interpretation

Post by KO »

I think what could be causing this is that you have text-align center for your primary nav. Try following:

#menuwrapper {
  /* Fix for Opera 8 */
  /*  overflow: hidden;  */

  border-bottom: 0px solid #C0C0C0;
  width: 750px;
  text-align: left; tag as it's set block element. Dropdown menu seems to affected by centrally aligned parent . If this woks try removing hack for IE7 to see that works also.

br, K
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: horizontal CSS-menu and IE6 interpretation

Post by Dr.CSS »

Actually the hack you used, called the star hack, is for IE6 or less so your margin-left: -52px is working on IE6...

I see you also took out the margin-left: -52px...
Last edited by Anonymous on Tue Oct 09, 2007 6:36 pm, edited 1 time in total.
mev
Power Poster
Power Poster
Posts: 371
Joined: Wed Apr 25, 2007 5:00 pm

Re: horizontal CSS-menu and IE6 interpretation

Post by mev »

KO wrote: I think what could be causing this is that you have text-align center for your primary nav.
As you seem to want have equal width navi blocks and align text center align it in tag as it's set block element. Dropdown menu seems to affected by centrally aligned parent . If this woks try removing hack for IE7 to see that works also.
br, K
Woww Ko, this works, never thought of this effect!!!

Didn't understand immediately what you wrote, but did you mean that the children drop down right below the central point of its parents because of this combination of values of the parents?

Anyway thanks soooo much.

Willemijn
KO
Power Poster
Power Poster
Posts: 562
Joined: Mon Nov 06, 2006 7:55 pm

Re: horizontal CSS-menu and IE6 interpretation

Post by KO »

To tell the truth I really don't understand IE's behaviour myself completely but I hit my head so many times that I'm starting to quess it's tricks. This has something to do that IE aligns also block level elements like and centrally with text-align:center. Firefox aligns only inline elements. As you set as block element you could aling text inside it but it does not affect to element which is outside and which child refers.

I don't know if this makes any sense but if you got it working then good.

br, K
Post Reply

Return to “Layout and Design (CSS & HTML)”