1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.1 How to fit a 728x90 header in place of existing header

Discussion in 'XenForo Questions and Support' started by tekgirl, Jan 8, 2012.

  1. tekgirl

    tekgirl Active Member

    I am trying to replace the CSS header and logo image with an image header...I get the attached...can someone help, please.

    Thanks header.jpg
  2. Brogan

    Brogan XenForo Moderator Staff Member

    On a default style you upload the image to your server, then set the path and height in Style Properties -> Header and Navigation -> Settings

    You will need to increase the width of the forum or reduce the width of your image to suit.
  3. tekgirl

    tekgirl Active Member

    Brogan, how about if I am using a style like XenFracture?
  4. Brogan

    Brogan XenForo Moderator Staff Member

    Well I would hope it would be broadly similar.

    If not, you will have to ask the style author as I don't own that style.
  5. tekgirl

    tekgirl Active Member

    OK - thanks. I would think it would be similar as well, but....it is not :(
  6. RobinHood

    RobinHood Well-Known Member

    Out of curiosity, what browser are you using tekgirl?
  7. tekgirl

    tekgirl Active Member

    Robinhood, I'm using Safari on Mac OS 10.6.8
  8. RobinHood

    RobinHood Well-Known Member

    Hi tekgirl, I had a few issues using the same theme and I've just had a look to see what I did when I first set it up.

    First of all you do what Brogan suggested and head to Style Properties -> Header and Navigation -> Settings

    and set the Header Logo Image Path along with the Height of Header Logo to match your logo.

    This leaves it correctly inline horizontally for me, but it's still off set vertically to the left. It looks like by default the logo is set to margin-left: 18px;

    So, to fix this I added the following to Extra.css by going to Appearance -> Templates

    #logoBlock #logo
    margin-left: 0px;
    This leaves it inline vertically and horizontally for me, but the rounded corners are gone. You can add them again by adding this to Extra.css:

    #logoBlock #logo
    img {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    I don't know if this is the best way of doing it, but it worked for me in modern browsers.

    I have noticed though that I do have major alignment issues with IE7 and below though where the logo is waaaay off. Even more so than the image in your first post, I'm not sure how to fix that though
  9. tekgirl

    tekgirl Active Member

    Thanks so much, robinhood! I have asked over in the xenfracture support, but no one ever answers or rarely answers, I should say. I will try this on a test site and see if I can come up with an IE7 fix...if I do, I'll post it here.

Share This Page