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 make the logo sit on top of the header background

Discussion in 'Styling and Customization Questions' started by dehness, Apr 27, 2015.

  1. dehness

    dehness Active Member

    Hi, we modify the header.css to change our logo (as the style properties are borked for some reason) and I'd like to change our logo to a larger version.

    This is the code we use:
    Code:
    .branding {
        background: #000 url('@imagePath/xenforo/logo/thedeh_logo.png') no-repeat top;
        height: 250px;
    }
    
    However, when I increase the size of the logo (to the values above), the navbar floats with it, as such:
    Screen Shot 2015-04-27 at 7.49.12 pm.png

    How do I fix this?
     
    Last edited: Apr 27, 2015
  2. dehness

    dehness Active Member

    Okay scratch that, I figured it out after playing with it enough.

    What I do need to know though, is how to make my logo overlay the background texture.

    Using this code in header.css prioritises the banner_texture over the logo. I would like the logo to sit on top of the background.

    Is there a priority flag or something I can add to the .branding?
    Code:
    }
    
    .branding {
        background: #000 url('@imagePath/xenforo/logo/thedeh_logo.png') no-repeat top;
        height: 268px;
    }
    
    .banner_texture {
        background-image: url('@imagePath/xenforo/xenfocus/background.png');
        height: 268px;
    }
    
     
    Last edited: Apr 27, 2015

Share This Page