Skip to main content

Forums

This topic contains 7 replies, has 8 voices, and was last updated by  photocurio 7 months, 1 week ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #41401

    damon
    Participant

    Because the wordpress admin bar has `html{ margin-top: 28px !important; }` forced in, it makes `html, body { height: 100%; }` too large.. and I don’t see how to compensate. It seems horrible to use javascript for this (remove 28px from body height and recalculate every time the window is resized..)

    Is there any way around this?

    #117816

    Watson90
    Member

    Hi @damon

    I can understand what you mean, but does it really matter if it breaks it, as the only time that code is active is when you are logged into WordPress as an admin.

    #117819

    chrisburton
    Participant

    You can completely remove the admin bar or put it below your footer.

    #128870

    Lox
    Member

    @damon, did you managed to solve that issue? I tried a negative bottom margin on html with no luck ….

    #128872

    noahgelman
    Participant

    On the Edit User Page, Uncheck the “Admin bar visible on front end” option.

    If that still doesnt work, follow this article: http://wp.tutsplus.com/tutorials/how-to-disable-the-admin-bar-in-wordpress-3-3/

    #128885

    TheDoc
    Moderator

    > I can understand what you mean, but does it really matter if it breaks it, as the only time that code is active is when you are logged into WordPress as an admin.

    This. What’s the point in disabling something that only you see?

    #246051

    Well, I’m a few years late with this response, but I just ran into this problem with a BuddyPress site I’m building where the admin bar is visible to all visitors. I was able to fix the problem by adding style="margin-top:0 !important" to the html tag in my header.php. Hope that helps!

    #273856

    photocurio
    Participant

    There is a simple solution. Add a conditional class ‘admin-bar’ to the HTML element like this:

    <html <?php
        language_attributes();
        echo is_admin_bar_showing() ? 'class="admin-bar"' : '';
    ?>>
    

    Then this CSS:

    html {
        height: 100%;
    }
    html.admin-bar {
        height: calc(100% - 32px);
    }
    
Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star