problems with css for menu on IE

  • Hi guys,
    I’m trying to set up a hebrew based blog for myself.
    However, I just can’t find a way to set up the menue to be on the left-hand side of the screen… I just can’t set it there.
    css entry for menue is as follows:
    #menu {
    width: 160px;
    margin-left: -730px;
    margin-top: 10px;
    float: left;
    text-align: right;
    background: transparent;
    }
    and for some reason, the menu just won’t move to the left hand.
    it works perfectly on Mozilla, yet Internet Explorer refuses to render it correctly.
    The <html> tag looks like that:
    <html xmlns=”https://www.w3.org/1999/xhtml&#8221; lang=”he” dir=”rtl”>
    and when i remove the ‘lang=he dir=rtl’ pice, it does seem to be working.
    does anyone have an idea as to what to do?
    the blog is eliezer.org/tst, css is /tst/wp-layout.css.
    any help would be greatly appreciated.

Viewing 10 replies - 1 through 10 (of 10 total)
  • Thread Starter aviv

    (@aviv)

    Hi Podz, thanks for the reply!
    I just tried it, doesn’t work.
    And again, it works very well on Mozilla (thanks for the tip, though, I took off the float and margin-left) – but IE won’t render it correctly.
    My css for menu is below.
    Could it be some bug with Internet Explorer? I’m using the latest version (6). Err. Microsft.. always have to do things different..
    #menu {
    width: 160px;
    left: 10px;
    text-align: right;
    }

    Try adding
    position: absolute;
    to it ..
    It’s trickier as I use Firefox to try stuff, but as this is in IE, and I can’t manipulate the css, I’m sort of guessing.

    Thread Starter aviv

    (@aviv)

    Hmm. Still, no luck.
    I, myself, also use Firefox. It’s so much better.
    Yet (almost) everyone out there use IE… That’s why I want to have it support IE.
    Any other idea / guess?

    Well I am sorry but it is no good jumping from float to absolute. A fixed width element should not have any margin or padding at all in either plane unless you either hack, or nest the divs. Otherwise it will bork in a number of browsers.

    Thread Starter aviv

    (@aviv)

    Root, I’ve removed all lines that included margin or padding.
    Still, I just can’t get the menue to the top-left of the blog.
    It keeps getting below the posts, for some reason (see the result at eliezer.org/tst – and css at /tst/wp-layout.css).
    could it be related to the dir=rtl that the <html> tag has? if I remove that dir=rtl, it gets better. but i do need that dir=rtl in place, so i’m kind of stuck…

    Thread Starter aviv

    (@aviv)

    Ok, looks like I found a way around it:
    if the dir=rtl is embedded in the <html> tag, the entire doc will be right-to-left, but IE will render the menu always to the right of the screen- overriding the right-to-left “content” (and yes, i’ve removed all padding and margins before testing it out).
    Solution to it was to remove the dir=rtl from the <html> tag, and put it only in the content div. this worked out well- IE rendered the page just fine.
    I hope it’ll help others as well. Thanks all for the feedback.

    Hello Aviv,
    When I employ simple math to the numbers below – it doesn’t work…
    #rap {width: 738px;
    #content {width: 708px;
    #menu {width: 160px;
    maybe if you narrow the content div so that the rap= (content+menu)+3…
    Good luck,
    Eddie

    I do not know if this problem has been fixed yet. But just a quick reminder. Fancy negative margin float schemes do not work well with borders on the elements. You need to test.

    Hi.
    I actually have the opposite problem: My menu works perfectly in IE, but cannot render properly in Firefox.
    My menu tags
    #menu {
    position: absolute;
    width: 190px;
    right: 0px;
    left:560px;
    top: 100px;
    }
    Site: https://www.larshvidberg.dk
    Would be greatful for any help.
    Lars

    Ooops, now it’s working. Forget about it.
    Lars

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘problems with css for menu on IE’ is closed to new replies.