Create layaut

[dementialsite]

... pero se io scrivo più della lunghessa del div il risultato che mi da e che il div me lo alarga e me lo sposta sotto dandomelo come un div senza id. ...

Hai provato ad impostare la giusta larghezza per il DIV centrale (che nell'ormai famigerato "post #4" era indicato con nome "main")?

Se neanche così funzionasse, prova con il CSS che ho nel mio sito (anche se è un po' più complicato in quanto ha 7 elementi e non 5 come nel "normale" layout 3 colonne). Contiene anche qualche piccolo hack per far digerire il mio sito (quasi) allo stesso modo su IE e Firefox (con il vecchio Mozilla non funziona):

/* banner superiore */
DIV#header { width:auto }

/* orologio e novità del sito */
DIV#news { float:left; width:20% }

/* menu superiore delle sezioni */
DIV#menu { width:100%; max-width:80% }

/* notizie extra sulla destra del sito */
DIV#extra { float:right; width:25% }

/* sezione principale */
DIV#main { margin-right:25%; width:100%; min-width:55%; max-width:55% }

/* banner in fondo pagina */
DIV#banner { clear:left; margin-right:25%; width:auto; min-width:75%; max-width:75% }

/* chiusura pagina */
DIV#footer { clear:both; width:auto }

<DIV ID="header">
<!-- banner superiore -->
</DIV>
<DIV ID="news">
<!-- orologio e news del sito -->
</DIV>
<DIV ID="menu">
<!-- menu superiore del sito -->
</DIV>
<DIV ID="extra">
<!-- notizie extra a destra del sito -->
</DIV>
<DIV ID="main">
<!-- sezione principale -->
</DIV>
<DIV ID="banner">
<!-- banner a fondo pagina -->
</DIV>
<DIV ID="footer">
<!-- chiusura pagina -->
</DIV>

Stammi bene...

nn so se tu sia riuscito ...prova guardare questo layut e semplice ma impostato a 3 colonne kome foto che hai messo tu...http://darkrouge.altervista.org/layut1.html
per vedere il codice clicca su visualizza e poi html . /altra cosa vedrai che ci sono i crediti quelli gli puoi togliere con consenso mio ...

Hai provato ad impostare la giusta larghezza per il DIV centrale (che nell'ormai famigerato "post #4" era indicato con nome "main")?

Se neanche così funzionasse, prova con il CSS che ho nel mio sito (anche se è un po' più complicato in quanto ha 7 elementi e non 5 come nel "normale" layout 3 colonne). Contiene anche qualche piccolo hack per far digerire il mio sito (quasi) allo stesso modo su IE e Firefox (con il vecchio Mozilla non funziona)

ho provato cosi e non mi si vede sempre il div centrale , senti dementialsite , puoi riscrivere il codice delle pagine con il layaut solo con la testata , un menu sinistro e il tag centrale , se ce la fai puoi metterlo anche un tag div sotto la tastata e sopra il menu e il div centrare


ah se riesci il div centrare fallo fisso, in modo che non aumenta la largessa quando aumenta il testo

[dementialsite]

Questo è il layout a due colonne:

/* banner superiore */
DIV#header { width:auto }

/* colonna sinistra */
DIV#menu_sx { float:left; width:20% }

/* sezione principale */
DIV#main { width:100%; min-width:80%; max-width:80%; overflow:auto }

/* chiusura pagina */
DIV#footer { clear:both; width:auto }

<DIV ID="header">
<!-- banner superiore -->
</DIV>
<DIV ID="menu_sx">
<!-- colonna sinistra -->
</DIV>
<DIV ID="main">
<!-- sezione principale -->
</DIV>
<DIV ID="footer">
<!-- chiusura pagina -->
</DIV>

Alla sezione principale ti ho aggiunto lo stile overflow, che regola il comportamento in caso di "sbordamento" dei contenuti. Come è impostato qui, visualizza gli scroller solo se necessario, se non ti piace puoi provare a sostituire hidden con scroll (scroller sempre visibili) oppure hidden (scroller non presenti e contenuto "tranciato"), oppure regolare separatamente scroller orizzontale e verticale usando gli stili overflow-x e overflow-y (che accettano allo stesso modo i valori auto, scroll e hidden).

Stammi bene...

grazie , e come si fa a far apparire tra la testata e il menu un div.

quale style si usa?

ah, e poi o provato a inserire nella testata un testo col tag <h1> , come tu sai questo con questo tag mi da più grande il testo , il problema e che quando lo applico me lo da più grande , ma mi da uno spazio tra la testata , il menu e il div centrale , come faccio a risorvere ?

[dementialsite]

Non credo di aver capito bene il tuo problema, comunque ti posso dire che, se inserisci i contenuti del tuo sito SOLO dentro a quei DIV che ti ho scritto sopra, non dovresti avere spostamenti o spazi dovuti ai contenuti.

Per regolare gli spazi tra un elemento e l'altro puoi usare gli stili margin (che definisce lo spazio tra il bordo dell'oggetto e quelli "confinanti") e padding (che invece definisce lo spazio tra i bordi dell'oggetto e i contenuti dell'oggetto stesso). Li puoi impostare separatamente, in questo modo (scrivo qui degli esempi):

margin-left:10px;
margin-right:3%;
margin-top:0.5em;
margin-bottom:1.5cm;

oppure tutti insieme, con una sola dichiarazione di stile:

/* in ordine: alto destro basso sinistro */
margin:0.5em 3% 1.5cm 10px;

Stammi bene...

impostanto i margini non mi lo risolve, cmq o risolto io stesso

grazie a tutti per il vostro aiuto , ora vorrei poter inserire un menu sinistro , mi dade il codice ?