Realizzare un layout elastico (come in esempoi)

[atmel]

Realizzare un layout elastico (come in esempoi)

Buongiorno a tutti voi.

Non ne capisco molto di css, quindi la mia domanda potrebbe esserre banale.

Volevo chiedervi un aiuto sul capire come è realizzata una pagina che ha quanto pare ha un layout fluido (spero si dica così).

La pagina è la seguente:
AccaTiTiPì : infobitsolution.in/WORK/bracelet/release/V2/index.htm

Provate a caricarla con l'inspector di Chrome in layout mobile. Noterete che al restringimento della larghezza il contenuto si adatta perfettamente in percentuale.

Ora sto realizzando una pagina simile, ma non riesco a fare quello che è stato realizzato in questa pagina.

Qualcuno, ispezionando il codice, sa dirmi il fattore determinante che dà questo effetto alla pagina?

Grazie!

[miwebdesign]

Ciao Atmel, sicuramente il passaggio mancante per ciò che ti serve sono le media query.

In CSS, puoi modificare i valori delle tue classi e dei tuoi ID in funzione della larghezza dello schermo o di molti altri parametri.

Un esempio pratico e veloce per capire la sintassi potrebbero essere due DIV che occupano il 50% dello spazio che diventano al 100% e uno sotto l'altro quando vengono visualizzati da Tablet.

#divuno,#divdue{
width:50%;
float:left;
}
@media ( max-width: 768px ) {,#divdue{
width:100%;
float:none;
}
}

Comunque puoi usare Bootstrap per realizzare Layout Responsive senza ammazzarti troppo la vita, è un Framework che ti permette di utilizzare classi che hanno già dei Breakpoint predefiniti per la maggior parte delle views.