• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Stopka na dole strony

0 głosów
140 wizyt
pytanie zadane 24 kwietnia 2021 w HTML i CSS przez FabQ Początkujący (430 p.)

Witam chciałbym żeby moja stopka była zawsze na samym dole strony. Zarówno gdy jest mało treści jak i dużo.

Gdy daje stopce:

position: absolute; bottom: 0;

to w przypadku gdy treści jest dużo stopka na nią nachodzi, wie ktoś jak to rozwiązać?

2 odpowiedzi

+1 głos
odpowiedź 24 kwietnia 2021 przez Wiciorny Ekspert (219,270 p.)
Lekturę, ogólnie polecam stronę.
https://css-tricks.com/couple-takes-sticky-footer/
komentarz 24 kwietnia 2021 przez FabQ Początkujący (430 p.)
edycja 24 kwietnia 2021 przez FabQ

Zrobiłem tak jak w poradniku różnymi sposobami i cały czas pojawia się ten sam problem, że zawartość razem ze stopką są na samym dole strony

view-source:http://castlecraft.pl/app/  <-- tutaj macie źródło mojej strony.

footer.css

footer html

komentarz 24 kwietnia 2021 przez Wiciorny Ekspert (219,270 p.)
wrzuć na code-pen lub  inne źródło, a nie jako pliki txt.
komentarz 24 kwietnia 2021 przez FabQ Początkujący (430 p.)
<!DOCTYPE HTML>
<html lang="pl">
  <head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <title>CastleCraft</title>
  <link rel="shortcut icon" href="/app/picture/logo.png">
  <?php require('require/fonts.txt'); ?>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="/app/css/header.css">
  <link rel="stylesheet" href="/app/css/footer.css">
  <style>
html, body {
    margin:0;
    padding:0;
    height:100%;
    position:relative;
  }
#container{
  min-height: 100%;
  position:relative;
}
#footer{
  position: absolute;
  width: 100%;
  font-family: 'Teko', sans-serif;
  color: gray;
  height: 30px;
  background-color: black;
}
#footer a{
  color: #0080FE;
  text-decoration: none;
}
#footer a:hover{
  text-decoration: underline;
}
  </style>
    </head>
  <body>
    <div id="container">
    <?php require('require/header.txt'); ?>
    <span style="font-size: 30px;">TREŚĆ</span>
</div>
    <div id="footer"><center>&copy2021 CastleCraft | <a href="#">Regulamin i warunki</a> | <a href="#">Polityka Prywatności</a></center></div>
  </body>
</html>

 

komentarz 24 kwietnia 2021 przez FabQ Początkujący (430 p.)
i dalej jest ten sam problem
0 głosów
odpowiedź 24 kwietnia 2021 przez CubeStorm Stary wyjadacz (14,960 p.)

To co ja aktualnie widzę na twojej stronie to stopka, która jest pozycjonowana przy użyciu fixed względem okna przeglądarki. Proponowałbym ci pozycjonowanie jej przy użyciu absolute względem body. Na body możesz dodać position: relative;

Jeśli teraz stopka będzie gdzieś na dole strony, a dalej zasłaniała końcówkę tekstu to możesz użyć nie bottom: 0, a bottom: -$WYSOKOŚĆ_STOPKI.

komentarz 24 kwietnia 2021 przez FabQ Początkujący (430 p.)
nie pomogło :(

Podobne pytania

0 głosów
1 odpowiedź 293 wizyt
pytanie zadane 17 lutego 2020 w HTML i CSS przez Antoni2422 Użytkownik (520 p.)
0 głosów
1 odpowiedź 703 wizyt
0 głosów
5 odpowiedzi 6,025 wizyt
pytanie zadane 11 listopada 2015 w HTML i CSS przez Duduś Początkujący (380 p.)

87,976 zapytań

136,557 odpowiedzi

304,510 komentarzy

58,337 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Sklep oferujący ćwiczenia JavaScript, PHP, rozmowy rekrutacyjne dla programistów i inne materiały

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...