← Back to Upcase

Switch column order for mobile layout


(Acandael Acandael) #1

I have a contact page with on the left a tabbed panel and on the left a box with contact information:

http://guarded-garden-4334.herokuapp.com/contact.html

however for the mobile layout I would like to have the box with contact information on top and the tabbed panel underneath.

Is this possible with Bourbon Neat ?

My repository is at: https://github.com/acandael/posplus

thanks for your help,

Anthony


(Cyle Hunter) #2

If you’re using rails you can use a helper method to detect the requesting agent. This definietly isn’t a silver-bullet, but just to give you an idea I’ve used a helper method similar to this in the past for detecting if the user was using a mobile device:

def mobile_agent?
  request.env["HTTP_USER_AGENT"][/(iPhone|iPad|iPod|BlackBerry|Android)/]
end

Here’s some additional solutions for JavaScript, PHP, Node, et al: http://detectmobilebrowsers.com/


(Geoff Harcourt) #3

I’m sure a designer would roll their eyes at this solution, but why not have two columns, one of which that’s hidden in mobile and the other which is hidden at desktop resolutions? You could control the display through media queries.