ho trovato sulle guide di html.it questo codice per fare il layout senza tabelle:
(l'ho un po' modificato)codice:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="it"> <head> <title>Layout a due colonne con float</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <link href="css/generale1.css" rel="stylesheet" type="text/css"> </head> <body> <div id="container"> <div id="header"> [img]immagini/visual_top.jpg[/img] </div> <div id="navigation"> <ul>[*]Home[*]Pillole[*]Contenuti[*]Grafica[*]Linguaggi[*]Webdesign[*]Software[/list] </div> <div id="content"> <h2>Layout a due colonne con float</h2> Il layout a due colonne con i float presenta un indubbio vantaggio rispetto ad un layout a due colonne con posizionamenti assoluti: non impone vincoli sulla lunghezza relativa delle colonne. D' altra parte obbliga, nella maggiorparte dei casi, ad avere la navigazione prima dei contenuti, cosa che può avere influenze negative su tematiche quali l' accessibilità e il posizionamento sui motori di ricerca. Il layout a due colonne si compone di quattro sezioni fondamentali: header, navigazione, contenuti e footer.</p> Il layout a due colonne con i float presenta un indubbio vantaggio rispetto ad un layout a due colonne con posizionamenti assoluti: non impone vincoli sulla lunghezza relativa delle colonne. D' altra parte obbliga, nella maggiorparte dei casi, ad avere la navigazione prima dei contenuti, cosa che può avere influenze negative su tematiche quali l' accessibilità e il posizionamento sui motori di ricerca. Il layout a due colonne si compone di quattro sezioni fondamentali: header, navigazione, contenuti e footer.</p> Il layout a due colonne con i float presenta un indubbio vantaggio rispetto ad un layout a due colonne con posizionamenti assoluti: non impone vincoli sulla lunghezza relativa delle colonne. D' altra parte obbliga, nella maggiorparte dei casi, ad avere la navigazione prima dei contenuti, cosa che può avere influenze negative su tematiche quali l' accessibilità e il posizionamento sui motori di ricerca. Il layout a due colonne si compone di quattro sezioni fondamentali: header, navigazione, contenuti e footer. </p> </div></div> <div id="footer">© 1997-2004 - Grafica, layout e guide sono di esclusiva proprietà </div> </body> </html>io volevo che il footer rimesse sempre in basso alla pagina...codice:/*stili per il layout fisso con posizionamenti assoluti*/ html,body{margin: 0 auto;padding:0} body{float:left;background: url(../immagini/sfondo.jpg);} div#container{position:relative; width: 760px;margin: 0 auto;text-align: left; } /*stili generici, su header e footer*/ div#header{height:114px;} div#footer a{color: #fff;font-weight: bold;text-decoration: underline} /*stili specifici per il layout*/ div#navigation{position:absolute;top: 114px;right: 0;width: 13em} div#content{margin-right: 13em;padding: 1em} div#footer{ height: 22px; background-color: #CECE0F; padding: 0.5em; font-size:11px; color: #fff} /*stili per la navigazione*/ div#navigation ul{margin: 1em 0 1em 1em;padding: 0; list-style-type: none;} div#navigation li{margin: 0;padding: 0} div#navigation a{color:#369;font: normal bold 1.2em/1.6em arial,sans-serif;text-decoration: none} div#navigation a:hover{color: #033;text-decoration: underline} div#navigation a#activelink{color: #033;text-decoration: none}
come devo fare???
Rispondi quotando
