CSS3 Responsive Layout – which method can i select?
Question by 3gwebtrain
HI i am making a website, this website having 3 different mockup for Desktop, tablets, Smartphones.. i can identifying the width using respond.js.
But i question is how can i switch the design to appropriate devices. i can change the width and height using query selectors, but how can i change the content of the page..
any good idea. In earlier i downloaded all contents and used to hide the unwanted content using display:none, i know this is wrong. which is the best way, apart from finding using server-side code?
thanks
Answer by Starx
I think it is wise to detect a mobile browser user agent string (server side) and display content accordingly.
If you are building using PHP, then check out this awesome script.
Usage is something like this:
if($isMobile){
header('Location: http://m.youdomain.com/' . urlencode($_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']));
exit();
}
Also check out the Switcher
