Dimensioni pagina scegliere layout

[xellisss]

Ciao a tutti, scusate se la mia domanda è "povera", ma in una semplicissima paginetta index.html senza pretese come si stabilisce senza troppi fronzoli l'impostazione-base migliore per tutti i browser sulla dimensione della pagina stessa?
Io ho provato questo:


<style type="text/css">
div#container
{
width: 900px;
position: relative;
margin-top: 0px;
margin-left: auto;
margin-right: auto;
text-align: left;
}
body
{
background-color: #000000;
color: #FFFFFF;
font-family: Arial;
font-size: 13px;
margin: 0;
text-align: center;
}
</style>

più o meno nei browser attuali con risoluzione media si vede benino, ma da cellulare si apre con uno spazio bianco nella parte sotto.
CHe alternative altrimenti avrei? Levando quel relative? Grazie della pazienza per chi vorrà rispondermi.

 

[Bedo]

...documentati in rete sulle varie soluzioni di layout possibili e sui loro vantaggi/svantaggi
..cerca con i termini layout fisso, layout liquido...

 

[LorenzoPi]

Allora se vuoi un sito che vada bene su tutti i dispositivi (soprattutto cellulare e tablet) conviene creare un tema Responsive, ossia il layout si adatta automaticamente alla larghezza dello schermo del dispositivo! inoltre un tema Responsive si basa sull'utilizzo delle Media Queries che si fanno all'interno del CSS! ad esempio nel css una media query è del tipo:

@media only screen and (max-width: 767px){ /* con questo si intende che questo stile css verrà applicato solo su dispositivi con schermo e la cui finestra del browser ha una larghezza massima di 767px */
     width: 100%;
     ecc......
}

Esistono diversi framework che mettono a disposizione queste caratteristiche e sono ad esempio Foundation e Bootstrap! vai sui loro siti e vedi la loro documentazione! è molto semplice

Io se vuoi ho creato uno strumento che permette di creare la base per siti Responsive (con questo intendo la generazione di HTML subito pronto per l'utilizzo) cliccando le varie opzioni disponibili e il tutto è basato sul framework Foundation! se vuoi dagli un'occhiata però è in inglese .. ecco il link: http://www.responsivetemplater.altervista.org/