Welcome to WebmasterWorld Guest from 54.196.232.162

Forum Moderators: not2easy

Message Too Old, No Replies

How to accomplish what bootstrap grid system does with it's .col-xs-

     
6:25 pm on Dec 2, 2013 (gmt 0)

New User

joined:Dec 2, 2013
posts: 2
votes: 0


Hi, I am looking to build a website in custom CSS and without frameworks just to increase my command over CSS. I want my entire site to retain its layout and look no matter what the device. Foundation does it with it's "smallgrid" and bootstrap with ".col-xs-". How do I do that without a framework?
5:27 pm on Dec 3, 2013 (gmt 0)

Senior Member

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Mar 15, 2002
posts:6807
votes: 0


Welcome to WebmasterWorld!

Just so I understand you correctly -- you want your site to retain its layout (presumably with as much consistency as possible) whether the device is landscape/portrait, regardless of width, height, or useragent?
7:38 pm on Dec 3, 2013 (gmt 0)

New User

joined:Dec 2, 2013
posts: 2
votes: 0


thats correct.
11:59 pm on Dec 3, 2013 (gmt 0)

Senior Member

WebmasterWorld Senior Member swa66 is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Aug 7, 2003
posts:4783
votes: 0


While I've no clue what "Foundation", "smallgrid", bootstrap with ".col-xs-" etc mean.

If you want all (modern) devices and browsers to show the same, then that's the easy part in CSS ;-)
Making a different layout for smaller devices (i.e. the smart thing to do nowadays!) is actually a bit (not that much) more work.
3:01 pm on Dec 4, 2013 (gmt 0)

Senior Member

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Mar 15, 2002
posts:6807
votes: 0


... but making it retain its layout (presuming you mean: look exactly the same) is not only a bad idea, it's impossible.

Sites should look like they are designed for the medium used to view them. That means vastly different layout, look, content, and functionality between viewing on a smartphone and using an Ultra-HD monitor.