Visualizzazione dei risultati da 1 a 6 su 6
  1. #1
    Utente di HTML.it L'avatar di fanoste
    Registrato dal
    Oct 2005
    Messaggi
    271

    footer sempre a fondo pagina

    ciao a tutti.
    sto impazzendo con un footer che vorrei che fosse sempre a fondo pagina, indipendentemente dal contenuto della stessa.
    cosa sbaglio in questo codice?

    CSS:
    codice HTML:
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, font, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
    
    body { line-height: 1; height:100%}
    ol, ul { list-style: none; }
    blockquote, q {	quotes: none; }
    
    blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none; }
    
    /* remember to define focus styles! */
    :focus { outline: 0; }
    
    /* remember to highlight inserts somehow! */
    ins { text-decoration: none; }
    del { text-decoration: line-through; }
    
    /* tables still need 'cellspacing="0"' in the markup */
    table { border-collapse: collapse; border-spacing: 0; }
    
    
    /*------------------------------------------------*/
    /*-----------------[BASIC STYLES]-----------------*/
    /*------------------------------------------------*/
    
    body { line-height: 18px; font-family: Helvetica, Arial, sans-serif; font-size: 12px; color: #000000;  background: #000; height:100% }
    
    a { text-decoration: none; color: #00b7f3; }
    a:hover { text-decoration: underline; }
    .clear { clear: both; }
    .ui-tabs-hide { display: none; }
    br.clear { margin: 0px; padding: 0px; }
    
    h1, h2, h3, h4, h5, h6 { padding-bottom: 5px; color: #151515; letter-spacing: -1px; line-height: 1em; font-weight: normal; }
    h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #151515; }
    h1 { font-size: 30px; }
    h2 { font-size: 24px; }
    h3 { font-size: 22px; }
    h4 { font-size: 18px; }
    h5 { font-size: 16px; }
    h6 { font-size: 14px; }
    p { padding-bottom: 10px; line-height: 18px; }
    strong { font-weight: bold; color: #1c1c1c; }
    cite, em, i { font-style: italic; }
    pre, code { font-family: Courier New, monospace; margin-bottom: 10px; }
    ins { text-decoration: none; }
    sup, sub { height: 0; line-height: 1; position: relative; vertical-align: baseline; }
    sup { bottom: 0.8em; }
    sub { top: 0.3em; }
    dl { margin: 0 0 1.5em 0; }
    dl dt { font-weight: bold; }
    dd  { margin-left: 1.5em;}
    blockquote  { margin: 1.5em; padding: 1em; color: #666666; background: #e6e6e6; font-style: italic; border: 1px solid #dcdcdc; }
    	blockquote p { padding-bottom: 0px; }
    
    input[type=text],input.text, input.title, textarea, select { background-color:#fff; border:1px solid #bbb; padding: 2px; color: #4e4e4e; }
    input[type=text]:focus, input.text:focus, input.title:focus, textarea:focus, select:focus { border-color:#2D3940; color: #3e3e3e; }
    input[type=text], input.text, input.title, textarea, select { margin:0.5em 0; }
    textarea { padding: 4px; }
    
    img#about-image { float: left; margin: 3px 8px 8px 0px; }
    
    .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
    * html .clearfix             { zoom: 1; } /* IE6 */
    *:first-child+html .clearfix { zoom: 1; } /* IE7 */
    
    /*------------------------------------------------*/
    /*---------------[MAIN LAYOUT INFO]---------------*/
    /*------------------------------------------------*/
    
    #background { position: relative; }
    	#backgrounds img { position: fixed; top: 0px; left: 0px; height: auto; min-height: 100%; min-width: 1024px; width: 100%; }
    	
    		#header { background:#FFF; border: 1px solid rgba(255,255,255,0.3); border-top: none; box-shadow: 0px 5px 7px 1px rgba(0, 0, 0, 0.1); -moz-box-shadow:0px 5px 7px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 5px 7px 1px rgba(0, 0, 0, 0.1); border-radius: 8px; -moz-border-radius: 1px; -webkit-border-radius:1px; border-top-left-radius: 0px;-moz-border-radius-topleft: 0px; border-top-right-radius: 0px; -webkit-border-top-left-radius: 0px; -moz-border-radius-topright: 0px; -webkit-border-top-right-radius: 0px; margin-left: 0%; margin-right: 0%; padding: 18px 17px 16px 30px; margin-bottom: 93px; position: relative; border-bottom-color:#CCC; border-bottom-width:2px; }
    		
    html,body{margin:0;padding:0;height:100%;}
    		  #footer {
                    position    : absolute;
                    bottom      : 0;
                    height      : 40px;
                    width       : 100%;
                    background  : #fff;
                    
                }
    
                #footer p {
    
                    border      : 1px #666 solid;
                    height      : 30px;
                }
    		
    			#logo { float: left; }
    			#header-right { float: right; }
    				ul#top-menu { float: right; margin-top: 40px; }
    				#search-form { float: right; background: url(images/search-bg.png) no-repeat; width: 197; height: 37px; margin-left: 35px; }
    					#search-form #searchinput { background: none; border: none; float: left; margin: 9px 7px 0 0px; width: 149px; padding-left: 15px; font-size: 12px; font-family: 'Yanone Kaffeesatz', Arial, sans-serif; color: #67647e; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3); font-size: 14px; }
    					#search-form #searchsubmit { margin-top: 12px; padding-top: 0px; margin-right: 9px; }
    						
    		#container { text-align: left; margin: 0 auto; width: 960px; position: relative; }
    			#featured-text { height: 123px; position: relative; margin-bottom: 115px; }
    				.slide h2.title { font-size: 72px; margin-bottom: 10px; }
    					.slide h2.title a { color:#868686; text-decoration:none; } /*originale color:#ffffff;*/
    				.slide { font-size: 30px; color:#ffffff; margin-bottom: 105px; position: absolute; top: 0px; left: 0px; text-align:center; width: 960px; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3); }
    				
    			#services { margin-bottom: 135px; }
    				#services .thumbnails { height: 145px; }
    				#services .description { background: url(images/container.png) repeat-x bottom left #fff ; filter: alpha(opacity=60); 
    -moz-opacity:0.6;/* mozilla */ 
    opacity: 0.6;  padding: 5px 20px 20px 23px; opacity:70%; text-align:justify; border: 1px solid rgba(255,255,255,0.3); border-top: none; box-shadow: 0px 5px 7px 1px rgba(0, 0, 0, 0.1); -moz-box-shadow:0px 5px 7px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 5px 7px 1px rgba(0, 0, 0, 0.1); border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;  margin-left: 5%; margin-right: 5%; padding: 10px 20px 10px 20px; margin-bottom: 93px; position: relative;
     }
    HTML

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="it-IT">
    <head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Viridia s.r.l.</title>
    <meta name="description" content="...i" /><meta name="keywords" content=".." /><link rel="canonical" href="http://http://www.XX.com/" />
    <link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />



    <script type="text/javascript">
    document.documentElement.className = 'js';
    </script>



    <meta content="InStyle v.1.6" name="generator"/>
    <style type="text/css">

    body { color: #000000; height:100%;}
    #content-area a { color: #; }
    ul.nav li a { color: #; }
    ul.nav > li.current_page_item > a, ul#top-menu > li:hover > a, ul.nav > li.current-cat > a { color: #868686; }
    h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #; }

    #sidebar a { color:#; }
    div#footer { color:# }
    #footer a, ul#bottom-menu li a { color:# }
    </style>

    <link media="screen" type="text/css" href="css/jquery.fancybox-1.3.4.css" rel="stylesheet" />
    <link media="screen" type="text/css" href="css/page_templates.css" rel="stylesheet" /><link rel='stylesheet' id='et-shortcodes-css-css' href='css/shortcodes.css?ver=1.7' type='text/css' media='all' />
    <script type='text/javascript' src='js/l10n.js?ver=20101110'></script>
    <script type='text/javascript' src='js/jquery-1.6.1.min.js'></script>
    <link rel="shortcut icon" href="images/logoico.ico" />
    <meta name="et_bg_image_speed" content="5000" /><meta name="et_service_image_speed" content="1000" /><meta name="et_disable_toptier" content="0" /><meta name="et_cufon" content="1" /> <style type="text/css">
    #et_pt_portfolio_gallery { margin-left: -11px; }
    .et_pt_portfolio_item { margin-left: 23px; }
    .et_portfolio_small { margin-left: -39px !important; }
    .et_portfolio_small .et_pt_portfolio_item { margin-left: 31px !important; }
    .et_portfolio_large { margin-left: -20px !important; }
    .et_portfolio_large .et_pt_portfolio_item { margin-left: 6px !important; }
    </style>

    </head>
    <body class="home blog chrome">
    <div id="background">
    <div id="backgrounds">
    </div>
    <!--<div id="footer">



    Copyright © 2011 VVVVV s.r.l. | XXX Specialist | Via XX, NN| NNNNNN CITTA | P.IVA 1234567889| All Rights Reserved

    Specialisti XYZ | DDD | VVV| UUUi</p>

    </div>-->
    <div id="header" class="clearfix">
    <a href="http://www.XX.com"> [img]images/logo_XXX_menu.jpg[/img]
    </a>
    <div id="header-right">
    <ul id="top-menu" class="nav">


    <li class="page_item page-item-6">LA NOSTRA STORIA
    <li class="page_item page-item-12">I NOSTRI SERVIZI
    <li class="page_item page-item-15">F.A.Q.
    <li class="page_item page-item-143">GALLERIA
    <li class="page_item page-item-19">CONTATTI

    [/list]


    </div>
    </div>
    <a href="http://www.XXX.com"> [img]images/logo_XXX_menu.jpg[/img]
    </a>


    <div id="container">


    <div id="services" class="clearfix">
    <div class="service">

    <div class="service-description-bottom">
    <div class="service-description">
    <div class="description">




    <span class='et-dropcap' style="”font-size:" > L </span>a pagina bla bla bla

    </div>
    </div>



    </div>
    </div>

    <script src="js/cufon-yui.js" type="text/javascript"></script>
    <script src="js/Colaborate-Thin_400-Colaborate-Medium_400.font.js" type="text/javascript"></script>
    <script src="js/Colaborate-Regular_400.font.js" type="text/javascript"></script>
    <script type="text/javascript" src="js/superfish.js"></script>
    <script type="text/javascript" src="js/custom.js"></script> <script type='text/javascript' src='js/jquery.easing-1.3.pack.js?ver=1.3.4'></script>
    <script type='text/javascript' src='js/jquery.fancybox-1.3.4.pack.js?ver=1.3.4'></script>
    <script type='text/javascript' src='js/et-ptemplates-frontend.js?ver=1.1'></script>


    </body>
    </html>

  2. #2
    Utente di HTML.it L'avatar di fanoste
    Registrato dal
    Oct 2005
    Messaggi
    271
    ragazzi nessuno mi aiuta? non riesco proprio a venirne fuori !
    please !!!

  3. #3
    Utente di HTML.it
    Registrato dal
    Sep 2001
    Messaggi
    21,188
    Originariamente inviato da fanoste
    ragazzi nessuno mi aiuta? non riesco proprio a venirne fuori !
    please !!!
    Il problema del footer e` stato ampiamente discusso nel forum.
    Inoltre ci sono fior di siti che lo tratano (alcuni dovrebbero essere citati tra i "link utili").

    E il tuo codice e` illeggibile:
    - troppo lungo: chi deve prendersi la briga di scansionarlo tutto a vista?
    - senza nessuna spiegazione
    - formattato in modo disumano (per inserire il codice esiste il tag CODE - bottone sopra l'area di inserimento testo).

    Se dopo aver cercato tra le risorse, ancora non riesci a venirne a capo, posta il link alla tua pagina, spiegando cosa non ti piace, e forse qualcuno puo` capire cosa devi fare per correggere
    Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
    No domande tecniche in messaggi privati

  4. #4
    Utente di HTML.it L'avatar di fanoste
    Registrato dal
    Oct 2005
    Messaggi
    271
    chiedo scusa per il codice postato alla carlona !
    ho provato diversi esempi postati nel forum senza però ottenere quello che cerco...


    cmq... mi spiego meglio.
    questa la pagina QUI
    in pratica vorrei che il footer apparisse sempre in fondo alla pagina.

    scusate ancora e grazie in anticipo a chi mi vorrà aiutare.

  5. #5
    Utente di HTML.it
    Registrato dal
    Dec 2010
    Messaggi
    84
    Prova con questo:

    #footer {
    position : fixed;
    bottom : 0;
    height : 40px;
    width : 100%;
    background : #fff;
    }

    Fammi sapere.

    Ciao!

  6. #6
    Utente di HTML.it L'avatar di fanoste
    Registrato dal
    Oct 2005
    Messaggi
    271
    Originariamente inviato da tk.6
    Prova con questo:

    #footer {
    position : fixed;
    bottom : 0;
    height : 40px;
    width : 100%;
    background : #fff;
    }

    Fammi sapere.

    Ciao!
    grazie, grazie, grazie e ancora grazie !

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 © 2026 vBulletin Solutions, Inc. All rights reserved.