Css e div

[Baluba]

Ciao a tutti,
sto creando una pagina web accessibile, composta da soli div.
Il layout grafico lo curo attraverso l'uso di CSS.

<div id="box">

<div id="top">spazio vuoto sopra logo</div>
<div id="barretta">logo orizzontale</div>
<div id="top">spazio vuoto sotto logo</div>

<div id="left">menu sx</div>
<div id="middle">div centrale per l'inserimento del testo</div>
<div id="right">menu dx</div>
<div id="fondo">menu di fondo pagina</div>

il css del div centrale (quello in cui ho un problema) è il seguente:

#middle {
background-color: #FFFFFF;
width: 508px;
float: left;
height: 100%;
margin: 0px;
}

quello del box esterno che contiene tutti i div, del body e del html sono questi:

html {
height: 76%;
}

body {
background-color: #88C2EE;
text-align: center;
margin: 0px;
padding: 0px;
height: 100%;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;

}

#box {
background-color: #FFFFFF;
text-align: left;
width: 768px;
margin-top: 50px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
height: 82%;
}

quando scrivo tante cose nel div centrale, non mi scrolla ma mi scrive sopra a quello inferiore. Come faccio??

[cyberman]

spostato su css

[pierofix]

Prima di sistemare il layout ti conviene correggere la struttura di markup, in vari punti:

- non puoi usare più id in una stessa pagina: sono univoci, quindi non si possono ripetere;
- l'uso dei div "top" è stupido (negazione di intelligente) in quanto servono alla grafica e non al contenuto;
- i nomi degli id e delle classi va dato con la semantica in mente: se ad esempio il div di sinistra contiene il menù di navigazione, l'id giusto da assegnargli sarà qualcosa tipo "menu" e non "left".

Non sono errori tecnici (a parte la ripetizione di id), ma il nuovo stile di progettazione si basa anche - ed è una caratteristica importante che lo distacca dal vecchio - su queste considerazioni.

[Baluba]

La ripetizione di id non è un problema e nemmeno il resto. Sono stupidate che si correggono in 2 minuti se non di meno.
Io avevo fatto una domanda e non mi è stato risposto, come mai?

[pierofix]

In quanto ho ritenuto opportuno metterti di fronte un problema molto più serio di quanto può apparire.

Quelli visti nel tuo codice sono sintomi di uno studio superficiale della struttura dei documenti, problema che si riperquoterà durante tutto lo sviluppo del sito, accumulando difficoltà come un rastrello trascinato su un campo pieno di foglie.

Tuttavia, sei libero di non fare caso a questo povero pazzo il quale ora darà comunque un'occhiata al css per capire dove sta il problema tecnico.

Esso comunque ripete che il nuovo web non è solo basato sugli aspetti tecnici, anzi.

[pierofix]

Dunqve, se voliamo rimaner sul teknik, qvesto e qvelo che pozo veder:

- manca la chiusura del div box nel markup (ma questo forse è solo un errore di trascrizione);
- a parer mio ti sei complicato troppo la vita con quel css: a cosa serve definire l'altezza dell'html pari a 76%?.

[Baluba]

Combinato grazie mille...

[pierofix]

E' sempre buona norma pubblicare la soluzione: se qualcuno dovesse aver lo stesso problema, potrebbe - tramite ricerca - trovare già la soluzione.