Footer content in het midden weergeven

Door Mohamed nvt op 15-09-2022 11:24 gewijzigd op 15-09-2022 11:25

6.236 views

Het klinkt misschien heel eenvoudig en het heeft eerder gewerkt, maar de content van footer gedeelte is nu geplakt aan de linkerkant.

De reden dat ik zeg dat het eerder heeft gewerkt en nu niet meer, omdat ik de footer gedeelte altijd aan de onderkant van een pagina laat weergeven, afhankelijk hoe groot de inhoud van een pagina is en dat is nu gelukt.

Ik gebruik hiervoor de volgende code:
Alles zit in de wrapper div


.wrapper {

    margin: 0 auto;
    padding: 0%;
    width: 70%;
    min-width: 640px;
    min-height: 100vh;
    border: 1px solid;
    background-color: black;
    position: relative;
    border-radius: 0px 0px 5px 5px;

  }

Alle content zit in de main div


.main {
    padding-bottom: 2.5rem;
    clear: both;
  }

Dan de footer plus p tag


.footer {
    position: absolute;
    bottom: 0;
    height: 2.5rem;
    clear: both; 
    }
  .footer p{
    text-align: center;

  }

Alvast bedankt voor het meedenken.

Ozzie PHP

15-09-2022 12:01

Beetje lastig te zeggen zonder werkend voorbeeld.

Gokje ... voeg dit eens toe:


.footer {
  width: 100%;
  text-align: center;
}

Mohamed nvt

15-09-2022 13:29 gewijzigd op 15-09-2022 13:30

Ozzie PHP op 15/09/2022 12:01:08

Beetje lastig te zeggen zonder werkend voorbeeld.

Gokje ... voeg dit eens toe:
.footer {
  width: 100%;
  text-align: center;
}

Yes het werkt TOP! Tnx!
Het werkende voorbeeld: www.jocke-overwater.nl

Jan R

15-09-2022 19:50

Zou een footer niet beter in een footer tag staan

Jan Koehoorn

16-09-2022 04:33

Omdat je nu text-align: center op .footer hebt, kun je de text-align-center op .footer p weghalen.

Ariën

28-07-2023 10:58

Reageren

Inloggen om te reageren