Visualizzazione dei risultati da 1 a 2 su 2

Discussione: Problema con il footer

  1. #1

    Problema con il footer

    Ciao a tutti. Dovrei far si che il footer non si sovrapponga con le cose che cerco, come potete vedere qui--> https://hard-questions.com/footermodifica il footer è sopra ad un articolo se provate a cercare "come".
    Come posso far si che il footer scorra con l'aggiunta di articoli alla pagina (tramite la ricerca)?
    questo è il codice del footer (sia html che css):
    codice HTML:
    <div id="pagina_di_fondo">        <footer id="bottom" class="row text-left p-4"><div class="col-12 col-md-4">    <label>Iscriviti alla nostra Newsletter per rimanere aggiornato</label>  <p>Email</p><form action="newsletter" method="POST"><div class="form-group">  <input type="email" name="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Inserisci email" required></div><input type="submit" name="registrati" class="btn btn-primary" value="Registrati!"></button></form><br></div><div class="col-12 col-md-8">  <div class="col-12 col-md-4">   <label>Consigliaci un articolo</label>   <p>Se hai un dubbio, vuoi farci una domanda o vorresti che pubblicassimo un articolo in particolare, compila <a href="https://hard-questions.com/consigliaci.html">questo</a> form.</p>  </div>  <div class="col-12 col-md-4">    <label>Chi siamo</label>    <p>Siamo due ragazzi amanti dell' informatica, frequentiamo entrambi il secondo anno di superiori in un istituto tecnico in provincia di PG. Abbiamo creato "hard questions" con l' intenzione di aiutare le persone più inesperte nel campo informatico. In questo sito pubblicheremo articoli/tutorial riguardanti il mondo dell' informatica...(e non solo).</p>  </div>  <div class="col-12 col-md-4"><label>Contattaci</label><p>Per collaborazioni o acquisto spazi pubblicitari all' interno del nostro sito, contatta <a href"https://mail.google.com/mail/u/0/?tab=rm&ogbl#inbox?compose=CllgCJlJVtMSfffcRdSRmtQvTklnmbBnbQtTTFJdRXSRrPrnbQVRVkCnMtfTSRMPxjbgQwqmKtL">hard-questionssocial@gmail.com</p></a>  </div></div></div></div></footer></div><!--fino a qui-->
            </body><style>
    .footer-blurb {    padding: 30px 0;    background-color: goldenrod;    color: black;}    .footer-blurb-item {    padding: 30px;    }.feature,.page-intro,.article-intro,.footer-blurb,.small-print {    text-align: center;    }#main {min-height: 600px;}#bottom {background-color: #222222; color: white;  width: 100%; bottom:0;}.row {    margin-right: 0px;    margin-left: 0px;}   @media (min-width: 801px) {#pagina_di_fondo{position:absolute; bottom:0;}}

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    4,732
    Ciao, in genere viene usata quella tecnica chiamata "Sticky Footer".

    Questo articolo su CSS-TRICKS spiega alcuni modi per ottenere tale impostazione: Sticky Footer, Five Ways

    Attualmente è consigliato l'uso di flexbox.

    Nel tuo caso potresti usare una cosa del genere dopo aver tolto dal footer quel position:absolute (che in questo caso non ti serve):
    codice HTML:
    html, body {
        height: 100%
    }
    
    body {
        display: flex;
        flex-direction: column;
    }
    
    .container {
        flex: 1;
    }
    Prima di postare considera che tra i link utili puoi trovare il 75% delle risposte alle tue domande; il 20% tra i post del forum; il 15% sul web.
    Ti resta... humm spè

    Le cattive domande sono quelle che non meritano risposta, le buone domande sono quelle che non hanno risposta
    L'Itailano non e nu'opnioine. E' improntate uslaro correattemtne sul froum. Garize!

Tag per questa discussione

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