Support » Fixing WordPress » items in header are 2px higher in chrome

  • Not sure why this is happening, or how to fix it, but the items in my header div (logo, company name, navbar, search form) line up in ff and safari, but in chrome the navbar and search form are 2px higher.

    *HTML and CSS both validate with no errors.

    Here the link: http://ericbrockmanwebsites.com/dev/

    Here’s my css

    logo:

    header #logo {
        display: inline-block;
        float:left;
        width: 50px;
        position: absolute;
        margin-top: 24px;
        width: 50px;
    }

    Company Name:

    header #name {
        position: absolute;
        display: inline-block;
        margin-top: 30px;
        margin-left: 55px;
        width: 330px;
    }

    navbar:

    header nav {
        margin-left: 395px;
        position: absolute;
        width: 400px;
        display: inline-block;
        margin-top:28.5px;
    }

    Searchform:

    header form#topsearch {
        background: #685a47;
        background: rgba(171, 152, 120, 0.5);
        width: 178px;
        height: 18px;
        position: absolute;
        display: inline-block;
        margin-top: 33.5px;
        right: 0;
        border-radius: 6px;
        -moz-border-radius:6px;
        -webkit-border-radius:6px;
    }

    Any help is greatly appreciated!

Viewing 2 replies - 1 through 2 (of 2 total)
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘items in header are 2px higher in chrome’ is closed to new replies.