HTML.it - Guida CSS di base - Impostare la larghezza

min-width espressa in pixel e senza width

Questo box ha una larghezza minima di 400px. La sua larghezza coincide con quella dell'elemento contenitore. Restringendo la finestra si nota che raggiunti i 400px (la larghezza minima), il box non si rimpicciolisce e il browser crea una barra di scorrimento orizzontale.

.box-1 {
 width: 400px;
 height: 200px;
 padding: 10px;
 border: 1px solid #002c53;
 background: #568ec0;
}

min-width con width espressa in percentuale

Questo box ha una width pari al 60%, ma non può scendere in sotto i 400px.

.box-2 {
 width: 70%;
 min-width: 400px;
 height: 200px;
 padding: 10px;
 border: 1px solid #002c53;
 background: #568ec0;
}