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

XF 1.4 Removing banner image from responsive designs.

Discussion in 'Styling and Customization Questions' started by Stemmy, Oct 3, 2014.

  1. Stemmy

    Stemmy Active Member

    Sorry for asking a question that has been covered before but i have read what i can and still cannot work out how to do this.

    Ive added an image to the desktop version of my forum but on the responsive versions obviously the static image does not reduce so breaks out of the template.

    I have found the custom CSS sections for each responsive template and i did see some people suggest code to go in there and yet others said not to.

    It all got very confusing so i thought i would ask for a definitive answer.

    Please can you tell me in very very basic language what i need to put where to stop the images showing ion the responsive designs.

    Thanks in advance.

    By the way my forum is at www.photography-forum.org
     
    Last edited: Oct 4, 2014
  2. Stemmy

    Stemmy Active Member

    nobody ???
     
  3. Brogan

    Brogan XenForo Moderator Staff Member

  4. 51463

    51463 Well-Known Member

    I've looked everywhere for the answer but no one seems to know how.

    I've searched every thread and everyone seems to have the same problem. They don't know how to put an ad to the right of the logo.

    The ad-header is really a pain and no one can get it. Or maybe i'm not skilled enough with css.

    But it always pushed my ad down and overlapped. And i havent seen to many forums out there with an ad on the right of the logo(A Big Logo).

    But tonight i figured it out! All i had to do is add this:


    <xen:if is="@enableResponsive">
    @media (max-width:1050px) {
    .myforumad {
    display:none;
    text-align: center;
    }
    }
    </xen:if>


    You would probably have to add a div class around your ad: <div class="stemmy">Ad Code Here</div>

    Then your code in EXTRA.css would be:
    <xen:if is="@enableResponsive">
    @media (max-width:1050px) {
    .stemmy {
    display:none;
    text-align: center;
    }
    }
    </xen:if>


    Except change the 1050px to whichever size you want your ad to disappear





    Now there is an add to the right of the logo and it disapperars when it's in mobile. 1 year i've been fighting with that stupid ad. Whoo hoo! I'm getting better at css. Now i just have to fix the gap under my header..

    Good luck.
     
    Last edited: Oct 5, 2014
    CNK likes this.
  5. Stemmy

    Stemmy Active Member

  6. Brogan

    Brogan XenForo Moderator Staff Member

    This: @media (max-width:800px)

    Read that resource, it is all explained there.
     

Share This Page