Ciao a tutti, vorrei creare un sito composto da un container che non occupa l'intero schermo ma solo una parte di esso e che si disponga al centro dello schermo.
Vorrei che il container fosse ridimensionabile ma non del tutto:
- se ho uno schermo grande il container non diventa enorme ma resta fisso su una certa dimensione (per esempio 800px)
- quando rimpicciolisco la finestra, il container deve diminuire di larghezza
- sotto però ad una certa dimensione non deve più ridimensionarsi ma rimanere fisso (e compare la scrollbar)
E' possibile?
Avevo pensato di usare le percentuali per width e i px per il min-width e max-width, potrebbe andare o c'è un metodo migliore per farlo?
Ho fatto una bozza in questo modo ma mi da dei problemi al rimpicciolirsi della finestra e non capisco il motivo, i px mi sembrano giusti..
HTML
codice:
<html>
<head><link rel="stylesheet" type="text/css" href="style.css"></head>
<body>
<div id="container">
<div id="logo">
LOGO
</div>
<div id="nav">
<ul>
<li>a</li>
<li>b</li>
<li>c</li>
<li>d</li>
</ul>
</div>
<div id="cont">
<div id="menu">MENU
</div>
<div id="testo">TESTO
</div>
</div>
<div id="footer">FOOTER
</div>
</div>
</body>
</html>
CSS
codice:
body {
background: red;
color: black;
width: 100%;
}
#container {
width: 85%;
margin: 0 auto;
background: orange;
min-width: 850px;
}
#logo {
width: 100%;
margin: 0 auto;
background: yellow;
height: 50px;
min-width: 850px;
}
#nav {
width: 25%;
background: green;
float: left;
height: 370px;
min-width: 250px;
}
#nav ul {
background: darkred;
}
#cont {
width: 75%;
background: pink;
float: right;
height: 100px;
min-width: 600px;
}
#menu {
width: 100%;
background: lightgreen;
float: right;
height: 50px;
}
#testo {
width: 100%;
background: lightblue;
float: right;
height: 300px;
}
#footer {
width: 100%;
background: darkgrey;
height: 50px;
float: left;
min-width: 850px;
}
Grazie mille 
PS: mi piacerebbe che se ho uno schermo grande vedo il container più piccolo della finestra mentre se la finestra si ristringe il container rimane sempre della stessa dimensione e ciò che si rimpicciolisce è il body esterno al container ma non penso che questo sia possibile..
Rispondi quotando
Originariamente inviata da darkhero
