design // new.edenspiekermann.com/en/

[sealonegrfx]

Hallo Forum,

ich hoffe auf eure Hilfe. Ich möchte zu gern eine Website erstellen, die genau so auf die Veränderung des Browserfensters reagiert, wie die Seite:

http://new.edenspiekermann.com/en/

-Nun habe ich schon versucht, mittels Quellcode und Firebug die Technik dahinter zu verstehen, finde aber nicht den richtigen Ansatz...

Kann mir einer von euch vielleicht einige Erkärende Worte liefern?

Wäre sehr, sehr nett, danke im Vorraus!

gruß

mj

[molily]

-Nun habe ich schon versucht, mittels Quellcode und Firebug die Technik dahinter zu verstehen, finde aber nicht den richtigen Ansatz...

http://new.edenspiekermann.com/stylesheets/style.css
Suche da mal nach @media - das ist schon die ganze Logik. Bspw.

/*  8-column, 1224 px layout for desktops and laptops  
 *  ------------------------------------------------------------------------  
 *  1      2      3      4      5      6      7      8  
 *  120px  264px  408px  552px  696px  840px  984px  1128px   (24px gutters) */  
@media only screen and (min-width: 1224px) {  
   ...  
}

Kann mir einer von euch vielleicht einige Erkärende Worte liefern?

http://www.heise.de/ix/artikel/Allen-recht-1058764.html
http://www.alistapart.com/articles/responsive-web-design/
http://adactio.com/journal/1700/

M.