[HTML] [PHP] dividere lo schermo in tre colonne

Ecco l'immagine in arrivo.

Intestazione_con_riga.png


Dove ci sono gli spazi devono partire fino al footer. Grazie spero di aver fatto in tempo.
 
fammi sapere se va bene!

HTML:
<!DOCTYPE html>
<head>
<style>
#header {
    background-color:black;
    color:white;
    text-align:center;
    padding:5px;

}
#nav {
    line-height:30px;
    background-color:#eeeeee;
    height:300px;
    width:100px;
    float:left;
    padding:5px;
}
#section {
    width:350px;
    float:left;
    padding:10px;

}
#footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
    padding:5px;
}
</style>
</head>
<body>

<div id="header" style="float:left; display:block; width:15% height:10%">
<h1>06/07/2016</h1>
<hr />
</div>
<div id="header" style="float:left; display:block; width:60%; height:10%">
<h1>MODULO D'ISCRIZIONE</h1>
<hr />
</div>
<div id="header" style="float:left; display:block; width:25%; height:10%">
<h1>vuoto</h1>
<hr />
</div>
<div id="nav">
Iscizioni<br>
Iscrizioni1<br>
Iscrizioni2
</div>

<div id="section">
<h2>Iscrizioni</h2>
<p>In questa sezione scrivo cio che mi piace </p>
<p>qui posso inserire immagini e altro come mi pare e piace :-)</p>
</div>

<div id="footer">
paperinik4 - tutti i diritti sono riservati...
</div>
</body>
</html>

copia e incolla questo link
 
  • Like
Reactions: paperinik4
Allora Ciao paperinik4 sono tornato a casa e facciamo un po di chiarezza perchè io dalle tue immagini non capisco la suddivisione dell'header in tre parti e se vuoi la riga orizzontale sopra o sotto le tre colonne, un'altra osservazione è che quando posti codice simostrativo devi postare il codice completo della pagina altrimenti un piccolo spezzone di CSS non serve a nulla.
Ora ti preparo un esempio e ti posto l'esito poi tu mi dirai le modifiche da fare!
Abbi pazienza un'oretta
!

P.S.
I tag di cui parli quali sono? Ovviamente con il forum nuovo è tutto cambiato. Dimmi quali cerchi e ti dirò chi sei.. emmh scusa! E ti dirò dove sono.

A dopo
 
  • Like
Reactions: paperinik4
Basta che clicchi sull'icona inserisci
 

Allegati

  • 01.jpg
    01.jpg
    6,3 KB · Visite: 406
  • Like
Reactions: paperinik4
Allora tu vuoi l'intestazione così come è? E tre colonne sotto divise da linee verticali?
Ora vedo di farti qualche cosa
 
  • Like
Reactions: paperinik4
fammi sapere se va bene!

HTML:
<!DOCTYPE html>
<head>
<style>
#header {
    background-color:black;
    color:white;
    text-align:center;
    padding:5px;

}
#nav {
    line-height:30px;
    background-color:#eeeeee;
    height:300px;
    width:100px;
    float:left;
    padding:5px;
}
#section {
    width:350px;
    float:left;
    padding:10px;

}
#footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
    padding:5px;
}
</style>
</head>
<body>

<div id="header" style="float:left; display:block; width:15% height:10%">
<h1>06/07/2016</h1>
<hr />
</div>
<div id="header" style="float:left; display:block; width:60%; height:10%">
<h1>MODULO D'ISCRIZIONE</h1>
<hr />
</div>
<div id="header" style="float:left; display:block; width:25%; height:10%">
<h1>vuoto</h1>
<hr />
</div>
<div id="nav">
Iscizioni<br>
Iscrizioni1<br>
Iscrizioni2
</div>

<div id="section">
<h2>Iscrizioni</h2>
<p>In questa sezione scrivo cio che mi piace </p>
<p>qui posso inserire immagini e altro come mi pare e piace :-)</p>
</div>

<div id="footer">
paperinik4 - tutti i diritti sono riservati...
</div>
</body>
</html>

copia e incolla questo link
Ciao cris,

Ho risolto il problema. Grazie della tua e vostra collaborazione.
 
Non ci posso credere!!!! finalmente ci siamo riusciti spero ! Evvaiiiii adesso l'unica cosa da fare e custodire il tutto con cura in bocca al lupo
 

Discussioni simili