Visualizzazione dei risultati da 1 a 6 su 6
  1. #1

    Layout elastico in altezza e posizione footer

    Ciao, avrei bisogno di un chiarimento.

    Ho scritto questo layout con l'intento di avere una pagina al 100% in altezza, con il footer sempre in basso.

    Però non riesco.

    Il "footer" rimane appiccicato al "content", in alto.

    Cosa sbaglio?

    GRazie


    codice:
     
    <style type="text/css">
    <!--
    body, html {
    	height:100%;
    	margin: 0;
    	background-color:#f1f1f1;
    		
    }
    
    #main {
    	margin: auto;
    	width: 760px;
    	height:100%;
    	background-color: #fcf;
    }
    
    #header {
    	height: 100px;	
    	background-color: #484848;
    	overflow: auto;
    }
    
    
    #content {
    	background-color: #fff;
    		
    }
    
    #footer {
    	height: 30px;
    	background-color: #60e;
    }
    -->
    </style>


    codice:
     
    <html>
    <head>
    </head>
    <body>
    
    <div id="main">
    	<div id="header">
    		header		
    	</div>
    	<div id="content">
    		content
    	</div>
    	<div id="footer">
    		footer
    	</div>
    </div>
    </body>
    </html>

    Allego un esempio grafico..
    1,2,3,4,5,10,100 passi!

  2. #2

    Allegato...

    ...
    Immagini allegate Immagini allegate
    1,2,3,4,5,10,100 passi!

  3. #3
    Utente di HTML.it L'avatar di stranyera
    Registrato dal
    Feb 2001
    Messaggi
    1,101
    #footer {
    height: 30px;
    background-color: #60e;
    clear: both
    }

  4. #4
    Originariamente inviato da stranyera
    Grazie per la risposta


    Ma non mi funziona...
    1,2,3,4,5,10,100 passi!

  5. #5
    Ho scritto questo layout con l'intento di avere una pagina al 100% in altezza, con il footer sempre in basso.
    http://www.themaninblue.com/experiment/footerStickAlt/

    Oppure

    http://alistapart.com/articles/footers
    "This is the end, Clark... for both of us"

  6. #6
    tnx

    1,2,3,4,5,10,100 passi!

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.