Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I've searched high and low for some way to setup my HTML5/CSS3 for various devices. Going by screen resolution isn't the best route because some times the screen size of one device is the same as another [e.g. my chrome book runs at 1280x800 and my android tablet runs at 1280x800] I'd want the website to look different for the tablet because it has touch capabilities meaning I can build a more "app like" design for that that I wouldn't want for my chrome book.

I've thought about the landscape vs portrait but that still doesn't get me there. @viewport and @media screen works to some degree as I can code for a browser vs mobile browsers but even the new iPhone/iPad has a higher resolutions than some legacy monitors.

I am truly stumped as to how I could code in a way to detect input type and load appropriately. (ie if touch display X if keyboard display Y)

share|improve this question
1  
Please refer to the answer to this StackOverflow question: stackoverflow.com/questions/11387805/touchscreen-media-queries –  toughskin Feb 15 at 5:18
    
best answer I've found yet. Thanks for pointing me in the right direction! –  John.Weland Apr 1 at 17:32
add comment

1 Answer

Have a look here: http://getbootstrap.com/css/#responsive-utilities-classes Maybe it can help you.

share|improve this answer
    
Welcome to Pro Webmasters! Whilst this may theoretically answer the question, it would be preferable to include the essential parts of the answer here, and provide the link for reference. –  John Conde Sep 18 '13 at 18:55
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.