pow
Premium Member
Registered: 11th Sep 06
Location: Hazlemere, Buckinghamshire
User status: Offline
|
Got a website I just want to simplify up by applying a stylesheet for a mobile device... but - what is the ideal width for a mobile browser?
Thanks 
|
Nismo
Member
Registered: 12th Sep 02
User status: Offline
|
Surely you would just set it to auto so it would work across all mobile platforms?
You could always set the meta viewpoint so it doesn't matter what width you set it at?
|
ed
Member
Registered: 10th Sep 03
User status: Offline
|
Just finished a mobile site. Used a fluid design with responsive images.
|
Dom
Member
Registered: 13th Sep 03
User status: Offline
|
Responsive layout.
|
pow
Premium Member
Registered: 11th Sep 06
Location: Hazlemere, Buckinghamshire
User status: Offline
|
Yeah I'm no web designer, you're gunna have to help me out with this 
Our school website has some maximum width set, then if it's below it loads a stylesheet that loads everything once-after-the-other... that's the aim I was looking for...
|
ed
Member
Registered: 10th Sep 03
User status: Offline
|
You can't really do that with a mobile though, there are too many different device widths. If you set the width to 100% and design for a portrait layout you've got a good starting point.
Unfortunately it's not as simple as designing to a 960px or 1050px fixed width, so you need to use a few tricks such as responsive images which will resize your images so they don't overflow or even a responsive layout which will display the page correctly no matter what sized device you're working with.
|
ed
Member
Registered: 10th Sep 03
User status: Offline
|
Crap - completely misread your post. This should give you some sizes to start with:
http://css-tricks.com/snippets/css/media-queries-for-standard-devices/
|
pow
Premium Member
Registered: 11th Sep 06
Location: Hazlemere, Buckinghamshire
User status: Offline
|
Basically if the browser is under 640px, I want to apply a linelar style sheet... does that make sence?
|
ed
Member
Registered: 10th Sep 03
User status: Offline
|
You could use this to target devices with a screen smaller than 640px:
@media only screen and (max-device-width:640px) {
/* Over-rides to existing styles to modify page layout */
}
|
pow
Premium Member
Registered: 11th Sep 06
Location: Hazlemere, Buckinghamshire
User status: Offline
|
That'll do, then I can use %age widths to keep everything happy mobile wise there.
|
Whittie
Member
Registered: 11th Aug 06
Location: North Wales Drives: BMW, Corsa & Fiat
User status: Offline
|
Easier to just stick to a fluid design.. width: 100% etc.
If not, read up on media stuff, should soon sort it.
http://www.w3.org/TR/CSS2/media.html
|
pow
Premium Member
Registered: 11th Sep 06
Location: Hazlemere, Buckinghamshire
User status: Offline
|
It's got 3 colums of text as per a customer spec so I just want to load them one after another on a mobile device really...
|
