layout monolitico e posizione navigazione

[francesco321654]

Ciao sto tentando di creare un sito usando i css come si deve e cerco di abbandonare una volta per tutte le tabelle ma sono incappato in un problemino puo essere una belinata ma non riesco a mettere appiccicata in alto il div navigation al div header chi mi da qualche consiglio?

[francesco321654]

ecco di seguito il foglio di stile ancora da completare
il mio problema e che tra header e navigation mi rimane dello spazio e non ho capito come fare ad annullarlo il css:
html,body{margin: 0;padding:0;height:100%;}
body{font-family: arial,sans-serif;font-size: 76%;text-align: center;}
body{background-image: url("./images/Acquarello_1.jpg")}
div#container{position:relative; width: 760px; height: 100%;margin: 0 auto;
text-align: left; border-left: 2px solid #36c;border-right: 2px solid #36c;}
div#container{height:auto;min-height:100%}
div#footer{position: absolute;bottom:0; width: 100%; padding: 0.5em 0;
background-color: #69c; color: #000;text-align:center;}
div#header{background-color:#909;color: #ff0}
h1,h2{margin: 0;padding:0}
h1{font: bold 2.3em/80px arial,serif}
h2{font-size: 1.5em}
div#footer a{color: #fff;font-weight: bold;text-decoration: underline}
div#navigation{background-color:#f3c}
div#content{background-color:#ffffff;padding: 1em 1em 5em;}
div#navigation ul{margin: 0;padding: 0; list-style-type: none;}
div#navigation li{display: inline; margin: 0 0 0 1em;padding: 0}
div#navigation a{color:#633;font: normal bold 1.2em/2.5em arial,sans-serif;text-decoration: none}
div#navigation a:hover{color: #fff;text-decoration: underline}
div#navigation a#activelink{color: #033;text-decoration: none}

[Al_katraz984]

metti

margin: 0;

all'interno dei parametri di div#navigation

[francesco321654]

ops ok
Grazie
mi tocca cambiare tutto alla pseudo cliente piace il blu
mi tocca ricominciare e io in grafica sono una schiappa

[LA VALE]

Originariamente inviato da francesco321654
ecco di seguito il foglio di stile ancora da completare
il mio problema e che tra header e navigation mi rimane dello spazio e non ho capito come fare ad annullarlo il css:
html,body{margin: 0;padding:0;height:100%; font-size: 0px;}
body{font-family: arial,sans-serif;font-size: 76%;text-align: center;}
body{background-image: url("./images/Acquarello_1.jpg")}
div#container{position:relative; width: 760px; height: 100%;margin: 0 auto;
text-align: left; border-left: 2px solid #36c;border-right: 2px solid #36c;}
div#container{height:auto;min-height:100%}
div#footer{position: absolute;bottom:0; width: 100%; padding: 0.5em 0;
background-color: #69c; color: #000;text-align:center;}
div#header{background-color:#909;color: #ff0}
h1,h2{margin: 0;padding:0}
h1{font: bold 2.3em/80px arial,serif}
h2{font-size: 1.5em}
div#footer a{color: #fff;font-weight: bold;text-decoration: underline}
div#navigation{background-color:#f3c}
div#content{background-color:#ffffff;padding: 1em 1em 5em;}
div#navigation ul{margin: 0;padding: 0; list-style-type: none;}
div#navigation li{display: inline; margin: 0 0 0 1em;padding: 0}
div#navigation a{color:#633;font: normal bold 1.2em/2.5em arial,sans-serif;text-decoration: none}
div#navigation a:hover{color: #fff;text-decoration: underline}
div#navigation a#activelink{color: #033;text-decoration: none}

TI volevo chiedere perchè hai dichiarato due volte body nel css, e perchè hai dichiarato due volte anche div container...

[francesco321654]

be ho dichiarato due volte anche il footer
devi sapere che e il primo sito che cerco di produrre senza usare le tabelle e pur leggendo in continuazione le guide di questo e di altri siti non è che io abbia le idee ancora chiarissime
però devo dire che al momento pure senza tabelle la pagina iniziale mi piace parecchio
in ogni caso: e un errore?
quale è il modo piu corretto di procedere?
ringrazio anticipatamente chiunque mi illumini a proposito,
sai comè ho quasi 40 anni e tutto cio che faccio e autodidatta non ho ne insegnanti ne amici che mi correggano apparte in web Marketing che ho trovato persone con una pazienza infinita come key o cicciput ecc. e poi pierofix che mi ha dato una mano ad avvicinarmi ai css ora vorrei vedere se riesco a mettere in pratica cio che ho imparato ma gli errori ......

[francesco321654]

ho rimesso a posto un po le cose mi direste quali errori riscontrate e se potete me li spiegate:
html,body{margin: 0;padding:0;height:100%;}
body{font-family: arial,sans-serif;font-size: 76%;text-align: center;
background-image: url("./images/Azzurro_con_vapore_bianco.gif");
scrollbar-highlight-color:#FFFFFF;
scrollbar-base-color:#003399;
scrollbar-arrow-color:#00FFFF;
scrollbar-shadow-color:#3300FF;}
div#container{position:relative; width: 760px; height: 100%;margin: 0 auto;
text-align: left; border-left: 2px solid #36c;border-right: 2px solid #36c;
background-color:#ffffff;height:auto;min-height:100%}
div#header{background-color:#0033cc;color: #ff0;bottom:0;}
h1,h2,h3{margin: 0;padding:0}
h1{font: bold 2em arial,serif}
h2{font-size: 1em}
div#content{background-color:#ffffff;padding: 1em 1em 5em;}
div#navigation{background-color:#69c;margin:0;}
div#navigation ul{margin: 0;padding: 0; list-style-type: none;}
div#navigation li{display: inline; margin: 0 0 0 1em;padding: 0}
div#navigation a{color:#003;font: normal bold 1.2em/2.5em arial,sans-serif;text-decoration: none}
div#navigation a:hover{color: #fff;text-decoration: underline}
div#navigation a#activelink{color: #cf0;text-decoration: none}
div#extra{float:right;width: 13em;background-color:#ffffff;padding: 1em 1em 5em;
border-left: 2px solid #36c;}
div#footer{float:left;width: 13em;;bottom:0; width: 100%; padding: 0.5em 0;
background-color: #69c; color: #000;text-align:center;}
div#footer a{color: #fff;font-weight: bold;text-decoration: underline}