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

XF 1.3 Header Banner Advice

Discussion in 'Styling and Customization Questions' started by TJA, Jun 20, 2014.

  1. TJA

    TJA Well-Known Member

    Sorry if this has been asked but have tried searching.

    I have replaced the header banner with my own, however when viewing on smaller screen some of the banner gets cut off, how do I prevent this from happening? Is there a way to get the banner to auto resize depending on size of screen you are viewing on.

    Thanks
     
    Last edited: Jun 20, 2014
  2. TJA

    TJA Well-Known Member

    Couple of examples:

    banner_1.png
    banner_2.png
     
  3. Brogan

    Brogan XenForo Moderator Staff Member

    Use max-width: 100% or a media query to change the banner depending on screen width.

    See the Responsive Design link in my signature for the latter.
     
  4. TJA

    TJA Well-Known Member

    Sorry to seem stupid but where do I put the max-width: 100% :confused:
     
  5. TJA

    TJA Well-Known Member

    I've adjusted page width controller in general to this:

    max-width: 100%;
    _margin: 0 auto;
    box-sizing: border-box;

    and it made no difference
     
  6. Brogan

    Brogan XenForo Moderator Staff Member

    Apply the max-width to your banner.
     
  7. TJA

    TJA Well-Known Member

    Sent you a conversation Brogan, thanks
     
  8. TJA

    TJA Well-Known Member

    Is this in a template I need to edit or a setting in styles I edit, some further instructions would be great, thanks.
     
  9. Brogan

    Brogan XenForo Moderator Staff Member

  10. TJA

    TJA Well-Known Member

    @Brogan thanks for that but that is only for the Logo, I have no issue with the logo just the header banner, or rather Header Background not being responsive to the width changes.
     

Share This Page