html - How do I make my website’s layout work gracefully with different browser window sizes, like Tumblr does? -

i start study asp.net now, understand basic html (css not) need how create website fit web browser,

like :

when resize first

and last

i try create own skill , website in mess

it's called adaptive layout technique more coined responsive web design (both great articles). gallery of websites employ technique can found @ mediaqueri.es.

the guts of based around using css style website default "wide view" using @media css queries apply css rules specific screen dimensions. example:

body { color:red; }  @media screen , (max-width: 800px) {     body { color:green; } }  @media screen , (max-width: 650px) {     body { color:blue; } } 

demo: jsfiddle.net/6lx9n (resize width of window see in action)