ciao a tutti,prima di tutto complimenti a tutto lo staf di html.it e un grazie per aver creato questo megasito pieno zeppo di cosette interessanti!
vengo al mio problema, sto lavorando ad un sito, e per la prima volta mi sono avvicinato al css x realizzare un layout table-less
per ora tutto ok, l'unica cosa che mi da problemi è il footer
http://www.aprilisola.it/berchidda_test/index2.asp
questo è il sito, io vorrei che il footer si posizionasse sempre a fondo pagina, sia che il div dei contenuti sia vuoto o che allunghi la pagina fino a fine scrollbar...
ho provato col float ma si posiziona subito sotto i contenuti (cioè se nn ce ne sono il footer si posiziona a metà pagina), con l'absolute invece si posiziona si a fondo pagina, ma se la pagina è molto lunga come muovo la scrollbar il footer rimane li, in mezzo alle @@!
come posso risolvere??? ecco il file .css
codice:
html,body{margin: 0;padding:0;height:100%;}
body{height:100%;font-family: verdana;font-size: 60%;text-align: center;background: url(images/bcg.jpg) repeat-y top center}
div#container{width: 673px;height:100%;padding-left:0px; margin: 0 auto;text-align: left;
border-left: 1px solid #7c6435;border-right: 1px solid #7c6435;
background: url(images/menu.jpg) repeat-y top right}
/*stili generici, su header e footer*/
div#header{float:top; height:21px;background:url(images/pager_0.jpg);padding-top:3px}
div#logo{float:top; height:114px;background:url(images/logo.jpg)}
div#menu{float:top; height:23px;background:url(images/pager_1.jpg);padding-top:3px}
h2{font:11px Century Gothic; color: #000000;}
h3{font-size:130%}
h4{font-size:120%}
div#footer a{color: #fff;font-weight: bold;text-decoration: underline}
/*stili specifici per il layout*/
div#navigation{float:right;width: 154px;left:50px; text-align:center}
div#content{margin-right: 160px;padding: 1em;margin-left:1em;background-color: #FFF; text-align:center}
div#footer{position:relative; clear:left;bottom:-1px;width:100%; text-align:center; padding: 4px; background:url(images/footer.jpg)}
/* altra roba*/
div#header_newz{float:top;border-bottom: 1px dashed; height:18px;padding-top:2px}
div#newz {float:center;width:100%;text-align:left;border: 1px dashed #7c6435;padding-bottom:5px}
div#lineup{float:center;width:100%;text-align:center;border-top: 1px dashed #7c6435;padding-top:2px}
div#forum_up{float:center;width:100%;text-align:left;padding-bottom:5px;background-color: #cdbd9b;border-bottom: 1px solid #7c6435}
div#newz_mini {float:left;width:40%;text-align:left;border: 1px dashed #7c6435;padding-bottom:5px}
table {font-face:verdana;font-size:10}
td#orari {font-face:verdana;font-size:10; border: 1px dashed #000}
A{color:#000000; font-size: xx-small; font-weight: bold; text-decoration:none}
A:hover{color:#FFFFFF}
A#mini{font:10px Century Gothic; color: #000000;}
A#mini:hover{color:#FFFFFF}
A#all{color:#000000; font-size:11px;font-family: verdana}
A#all:hover{color: #646464; text-decoration : underline;}
A#allmini{font: 10 Verdana; color:#000000;}
A#allmini:hover{color: #646464; text-decoration : underline;}
A#orange{font: 10 Verdana; color:#FF6600}
A#orange:hover{color: #FF9966; text-decoration : underline}
A#orangebig{font-family : Verdana; font-size: 11px;
color:#FF6600}
A#orangebig:hover{color: #FF9966; text-decoration : underline}
p{margin: 0px;padding: 0}
DIV.clTopMenu{position:absolute; width:101px; clip:rect(0,101,25,0); visibility:hidden; z-index:31;}
DIV.clTopMenuBottom{position:absolute;down:23px; width:101px; height: 3px; clip:rect(0,101,3,0); layer-background-color:#CECFCE; background-color:#7c6435; z-index:2}
DIV.clTopMenuText{position:absolute; width:101px;left:0; top:25px; font:12px Century Gothic; background-color:#9b8251; z-index:1}