html5 - How the Grid System works for full width page? -


how grid system works websites expand full size of browser (no matter how resize) while working 12 grid_ system?

for example, take on these websites:

http://vevo.com

http://xfinitytv.comcast.net

http://pinterest.com

is there technical name this? why there's no many websites take advantage of full browse size?

thanks

the "technical name" you're asking called "fluid" layout. in terms of how achieve in bootstrap, answer depends on whether you're using v.2.x or newly released version 3. in version 2.x fluid effect obtained wrapping grid elements in "container-fluid" class. in release 3, "container" class fluid default. (see bootstrap: migrating 2.x 3.0 more.)

as why more sites don't use fluid layout in most, that's rather subjective question. i'll comment personal experience (15 years in web design , development)> fluid design doesn't become problem until larger displays, having content stretched out across entire width of screen can pose usability problems. specifically, block of text can become difficult read if lines become long. longer lines of text, more difficult eye find start of next line. also, images stretched wide loose sharpness (assuming technique used). put, people large displays typically don't want or need entire display taken content. web applications exception this, since online apps have grids of data display , many columns, data panels, menus, etc. necessitate user maximize use of available display area. web search "fluid vs. fixed width layout" , you'll plenty of resources comparing 2 approaches.


Comments

Popular posts from this blog

java - Run a .jar on Heroku -

java - Jtable duplicate Rows -

validation - How to pass paramaters like unix into windows batch file -