Responsive Design

Responsive Design

Brogan

XenForo moderator
Staff member
It's not a responsive design issue - it's basic styling/template issue, so it's off topic for this thread.
 

jonoathome

Active member
It's not a responsive design issue - it's basic styling/template issue, so it's off topic for this thread.[/QUOTE

I didn't think it was off topic sorry.. I know its a template issue, hence my question..


I was reading responsive design, whilst the style responds well to responsiveness, I am lookng for a advice of where to look in the style to pinpoint the issue..
 
Last edited:

Brogan

XenForo moderator
Staff member
There isn't a responsive mode as such.

There is a flag, which if set, changes the layout based on the width.
That is independent of the device and applies equally to desktop computers, tablets, mobile devices, etc.

You would need a custom solution to serve different styles based on device type.
 

ibaker

Well-known member
I have a problem that is to do with Height, not width. I am using responsive however on my specific Galaxy Note Pro tablet, and as I have found out, on older android phones, that when you go to enter something in a text box the keyboard comes up and takes up vertical real estate of the screen. IPads and newer Android phones like my Galaxy S7 doesn't have this issue as the keyboard lays on top of the web page. So when the Keyboard comes up, which can take up half the height, to type something into the text box, the responsive goes into action and changes the menu etc to half the screen size and I lose the text box. This then sends the keyboard back down instantly and the responsive kicks in for a larger screen again.

Basically what I am saying is, on a Samsung Galaxy Note Pro tablet I lose half the height by the keyboard which throws the responsive settings into chaos. You can try it if you have a tablet by trying to use the Search function on my site at www.recreationalflying.com
 

Brogan

XenForo moderator
Staff member
That's an issue with the device and not something XF has any control over.
 

ibaker

Well-known member
I know that Brogan but it is what I am trying to overcome and make XF i.e. my site, user friendly on more devices
 

dutchbb

Well-known member
Was testing some resizing for banner ads (not adsense, own banners) and found this works, no css change just add in the ad template "width=100%" like this:

<a target="_blank" href="place ad link here"><img src="location ad upload/ad.jpg" width="100%" /></a>

Just have to find a way for max size because it will enlarge on big screens with fluid style.
 

limboclub

Active member
Apologies - I stuck my comment in the rating area. Not sure why you got so annoyed after a string of 5-star ratings.

The question would be:

Is the responsive system going to cover all Style Properties at any point? Right now it's a bit messy and inefficient to use Extra.css when you have a full styling system in place.
 

sbj

Well-known member
What would be the correct way for XF 2.2?

I want to use CSS which is applied for every view except for the mobile view.

Would this be the way?

CSS:
<xf:if is="!@enableResponsive">
.myCSS {
border: none;
}
</xf:if>
 

zoldos

Well-known member
I'm still using XF 1.5.x. Is there an add-on or some sort of mobile mod I can get? One of my users says my theme isn't really mobile friendly, but I can't change it since it's been modded too much. Thanks!!
 
Top