lisalisalisalobe
New Member
I am building a tumblr theme that needs to be highly scalable/responsive. It is pretty much just the posts in a centered grid. I am using CSS media queries to keeo track of the browser window size, to resize/center the grid accordingly. They currently look like this:\[code\]<link rel='stylesheet' media='screen and (max-width: 640px)' href='http://stackoverflow.com/questions/13804079/URL.css' /><link rel='stylesheet' media='screen and (min-width: 640px) and (max-width: 959px)' href='http://stackoverflow.com/questions/13804079/URL.css' /> <link rel='stylesheet' media='screen and (min-width: 960px) and (max-width: 1279px)' href='http://stackoverflow.com/questions/13804079/URL.css' /> <link rel='stylesheet' media='screen and (min-width: 1280px) and (max-width: 1599px)' href='http://stackoverflow.com/questions/13804079/URL.css' /> <link rel='stylesheet' media='screen and (min-width: 1600px) and (max-width: 1919px)' href='http://stackoverflow.com/questions/13804079/URL.css' />\[/code\]The first one, which Maxes out at 640px width, works perfectly when I resize a firefox/chrome window to be small, but seems to not work at all on mobile. My phone is a Droid Razr Maxx, and it seems to default to the 960px width, even in "portrait" orientation.I tried having the styles default to the mobile-size style, but get the same result, and this is also less than optimal for other reasons (Internet Explorer being one.)