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

XF 1.2 At what pixel width does xenforo rsponsive break in to two

Discussion in 'Styling and Customization Questions' started by gavpeds, Nov 30, 2013.

  1. gavpeds

    gavpeds Active Member

    Hi so i an trying to sort out responsive adsense and am wanting to figure out at what pixel point is it that the forum breaks out from the one column to two column layout?
  2. Adam Howard

    Adam Howard Well-Known Member

    I do not believe XenForo natively divides into 2 columns.
  3. Phases

    Phases Active Member

    If you mean sidebar being under content versus to the side.. those break points are in your Style Properties "Responsive Design" section. But I wouldn't mess with that.

    I've got sorting responsive ads pretty down, but it's hard to explain. Start with using a second window. Say you're working on your header ad. Maximize this second window, and have it showing the highest size ad at the highest break in your min-width statement. Then slowly resize your browser window's width until the ad either pops down a line or starts to break out of your template. Then, refresh that window (sadly, they're not truly responsive ads). If it is still the same, the same size ad, you will need to change the min-width (or max depends on what your doing) for that ad size. That very point is what you want your min-width for that ad size to be. (actually a hair larger, but leave it there for now for testing.)

    You can either just raise the min-width number in your code a little at a time, keep refreshing your other window until it pops back into place, or use an extension (Web Developer for chrome will tell you current window size) to get the window size. Once you've got that point acting correctly it should drop down to the next ad size on refresh, and if you go just a hair larger, refresh, your bigger ad should. (sometimes the big ads use the full slot behind the scenes but only display a smaller one! Look at source to see which or highlight the whole area to see the outline).

    Then, go down further and rinse repeat for middle and mobile sizes your worried about.

    You can continue to use your browser to test, or a phone in landscape then portrait, for example. It won't be as simple as locating correct numbers putting them and being down with it.

    I have to use this method in some places and this in others.

    I'm not sure I helped at all, I know my explanation was probably confusing, but hope it helps.
    Last edited: Nov 30, 2013
  4. Brogan

    Brogan XenForo Moderator Staff Member

    I will quote the bottom of the resource:
    Adam Howard likes this.

Share This Page