Skip to:
Content
Pages
Categories
Search
Top
Bottom

New Default BP theme: admin bar drops to bottom of page in IE6

  • Avatar of 3sixty
    3sixty
    Participant

    @3sixty

    Argh… is anyone else using the “new” buddypress default theme that comes with BP 1.2? I just discovered that the adminbar is dropping to the bottom of the page in IE6.

    Test your theme in IE6 and let me know what you see. I used these two methods:

    IETester

    ipinfo.info/netrenderer

Viewing 18 replies - 1 through 18 (of 18 total)
  • Avatar of r-a-y
    r-a-y
    Moderator

    @r-a-y

    I believe the BP default theme was not coded with IE6 in mind.

    The problem is IE6 doesn’t support the position:fixed CSS attribute.

    One way around this is to put this in your child theme’s CSS:

    * html #wp-admin-bar {position:absolute;}

    Besides, no one likes IE 6 ;)

    Yes, the 1.2 theme wasn’t built specifically to work with IE6. Andy said that if anyone wanted to test it and patch and bugs for IE6, that’d be fine.

    Avatar of 3sixty
    3sixty
    Participant

    @3sixty

    THANK you, r-a-y – this works fine. It’s still a bit of kilter, but at least it’s at the top and I can deal with the rest later.

    I can understand why IE6 would not be supported. Unfortunately, lots of people out there still use IE6, many not by choice. This was actually brought to my attention by one of my users, who only has access to IE6 at her organization.

    A couple other hacks that may help people dealing with IE6 issues…

    To keep large post images from collapsing the sidebar

    .post img {

    max-width:400px;

    width: expression(this.width > 400 ? 400: true); /*IE6 hack*/

    }

    To keep the sidebar from collapsing altogether (ie, when the user narrows the browser window: get rid of the max-width and min-width properties of body {}. Set a fixed width.

    Avatar of r-a-y
    r-a-y
    Moderator

    @r-a-y

    3sixty, it might be good to document your IE6 journey and perhaps we can get your CSS included in core.

    Suggestion for you, use the * html CSS hack to target IE6 specifically, then you wouldn’t need to use expressions, which isn’t valid CSS.

    So your above code would look something like:

    * html .post img {width:400px;}

    If I have some time, I’ll look at creating an IE6 CSS patch.

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    Please do NOT include support for IE6 in core. We need to move on. It’s like painting your car when the bottom is rusted out.

    Avatar of r-a-y
    r-a-y
    Moderator

    @r-a-y

    Haha, true true, Modemlooper!

    Maybe as a child theme then.

    Avatar of Peter Anselmo
    Peter Anselmo
    Participant

    @peteranselmo

    Or just a plugin that loads a stylesheet wrapped in an IE6 conditional comment.

    Avatar of r-a-y
    r-a-y
    Moderator

    @r-a-y

    Yes, that would work as well ;)

    Avatar of 3sixty
    3sixty
    Participant

    @3sixty

    Thanks, was not aware that the * html hack was an IE6 trigger! It works much better!

    Avatar of r-a-y
    r-a-y
    Moderator

    @r-a-y

    Cool, do let us know what CSS you added to make the default BP theme compatible with IE6.

    Avatar of 3sixty
    3sixty
    Participant

    @3sixty

    hmm, I was afraid of this:

    * html .post img {width:400px;}

    This code limits posted images to 400px… but it also stretches small images to 400px.

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    max-width

    Avatar of r-a-y
    r-a-y
    Moderator

    @r-a-y

    @3sixty

    If you’re reliant on max-width, then you’ll need to use the expression rule.

    Avatar of 3sixty
    3sixty
    Participant

    @3sixty

    r-a-y is right. The issue is that IE6 doesn’t understand max-width, so what Modemlooper is suggesting would just give IE6 css that it doesn’t understand anyway.

    Avatar of 3sixty
    3sixty
    Participant

    @3sixty

    Grrr. The weird thing is I can’t get the expression rule to work in WPMU with no plugins running. The expression rule works perfectly on a raw html/php page (site.com/test/maxwidth.php). Will try reinstalling WPMU and see what happens.

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    See been so long since I’ve dealt with IE6 I forgot LOL

    Using this will completely fix the admin-bar in IE6, even when using fluid width.

    body {
    position: relative;
    }
    * html #wp-admin-bar {
    position: absolute;
    }
    * html #wp-admin-bar .padder {
    width: 100% !important;
    }

    You’ll still have the problem that the dropdown for the “Visit” menu at the upper right doesn’t have room, because the dropdown incorrectly aligns to the right side of the screen. Just scoot it over a bit to the left to make room…

    * html #wp-admin-bar ul li.align-right {
    right: 140px;
    }

Viewing 18 replies - 1 through 18 (of 18 total)

You must be logged in to reply to this topic.