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

Jak zrobić by stopka była zawsze na dolę?

0 głosów
156 wizyt
pytanie zadane 13 września 2020 w HTML i CSS przez Robot 12 Początkujący (340 p.)

Hej zaczynam swoją przygodne z HTML i CSS tworze swoją 1 stronę  i mam problem bo stopka nie chce się czy mać dołu.

CSS

body
{
    background-color: #868686;
     margin:0;
	padding:0;
    height:100%;
}
#container
{
margin: -11px -10px -10px -10px ;
min-height:100%;
position:relative;
}
#pasek_gura
{
    position: -webkit-sticky;
    position: sticky;
    top: 0;
	min-height: 100px;
	background-color: #262626;
	z-index: 10;

}
#logo
{   
    padding: 5px;
    float: left;
}
#Kontakt
{
    text-decoration: none; 
    min-height: 40px;
    padding: 10px;
    margin-right: 1px;
    float: right ;
    color: #ececec;
}
#Kontakt:hover
{
    background-color: #393939;
}
#Wspierajoncy
{
    text-decoration: none; 
    min-height: 40px;
    padding: 10px;
    margin-right: 1px;
    float: right ;
    color: #ececec;
}
#Wspierajoncy:hover
{
    background-color: #393939;
}
#Poradniki
{
    text-decoration: none; 
    min-height: 40px;
    padding: 10px;
    margin-right: 1px;
    float: right ;
    color: #ececec;
}
#Poradniki:hover
{
    background-color: #393939;
}
#home
{
    text-decoration: none; 
    min-height: 40px;
    padding: 10px;
    margin-right: 1px;
    float: right ;
    color: #ececec;
}
#home:hover
{
    background-color: #393939;
}
#informacje
{
    padding: 300px;
    color: #ececec;
    min-height: 300px;
    background-color: #737373;
    clear: both;
}
#Naguwek
{
    font-size: 30px;
    position:relative;
    Top:-190px;
}
#innfo
{
    position:relative;
    Top:-100px;
}
#dolanczanie
{
    font-size: 40px;
    padding: 10px;
    background-color:#262626;
    color: #ececec;
    min-width:400px;
}
#dolanczanie:hover
{
    background-color: #393939;
}
#adminstracja
{
    padding: 40px;
    color: #ececec;
    min-height: 1000px;
    background-color: #868686;
}
#aNagluwe
{
    font-size: 35px;
}
#Robot
{
    padding: 40px;
    color: #ececec;
    min-height: 250px;
    position:relative;
    left: -20px;
}
#kaczor
{
    text-align: left;
    padding: 40px;
    color: #ececec;
    min-height: 250px;
    position:relative;
    left: -20px;
}
#brajan
{
    text-align: right;
    padding: 40px;
    color: #ececec;
    min-height: 250px;
    position:relative;
    left: -20px;
}
#grenek
{
    text-align: right;
    padding: 40px;
    color: #ececec;
    min-height: 250px;
    position:relative;
    left: -20px;
}
#stopka
{
	    padding: 0px;
    min-height: 70px;
    background-color: black;
    color: #ececec;
    clear: both;

}






#pszerwa
{
        font-size: 40px;
    padding: 10px;
    color: #ececec;
    margin-left: 100px;
	margin-right: 100px;
	min-height: 600px;
}


#kontakt
{
    padding: 10px;
    color: #ececec;
    margin-left: 100px;
	margin-right: 100px;
	min-height: 600px;
}

Wiem że były już tu takie wątki ale żadne rozwiązanie nie chciało mi działać.

1
komentarz 13 września 2020 przez gnu_ewm Gaduła (3,340 p.)
Tworząc stronę dobrą praktyką jest używanie angielskich nazw.
komentarz 19 września 2020 przez RobertGelu Nowicjusz (120 p.)

<div id="footer">

Something tralalala

</div>

w CSS

div#footer    {
    position:fixed;
    width: 100%;
    border: 4px solid #7c7;
    background-color: black;
    color: white;
    text-align: center;
    bottom: 0px;
}

2 odpowiedzi

+1 głos
odpowiedź 13 września 2020 przez KosaTV Obywatel (1,260 p.)
wybrane 13 września 2020 przez Robot 12
 
Najlepsza

Masz straszny bałagan w kodzie i to on powoduje problemy. Zamieniłem tylko trochę ten kod html żeby chociaż działał, ale nadal uważam że praktycznie wszystko jest do poprawy, a potem pozmieniaj sobie co tam chcesz.

<!DOCTYPE HTML>
<html lang="pl">
<head>
    <meta charset="utf-8" />
    <link rel="shortcut icon" href="imige/logo.png">
    <title>Polski RoolPlay Discord</title>
    <meta name="description" content="Strona serwera Polski RoolPlay Discord" />
    <meta name="keywords" content="PRD,RP,POLSKI,polska" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
     
    <link rel="stylesheet" href="index.css" type="text/css" >
</head>
<body>
 
	<div id="container">
		<div id="pasek_gura">
			 <div id="logo">
			<img src="imige/logo.png" width="150" height="90" />
			</div>
			
			<a href="Kontakt.html">
			<div id="Kontakt">
			<h1>Kontakt</h1>
			</div>
			</a>
			
			<a href="Wspierajacy.html">
			<div id="Wspierajoncy">
			<h1>Wspierający</h1>
			</div>
			</a>
			
			<a href="Poradnik.html">
			<div id="Poradniki">
			<h1>Poradniki</h1>
			</div>
			</a>
			
			<a href="index.html">
			<div id="home">
			<h1>Home</h1>
			</div>
			</a>
			
		</div>
			<div>
			</div>
		 <div id="footer">
			<h6>Wszelkie prawa zastrzeżone <br>©Autor: Robot 12<br><h6>
		</div>
	</div>
 
</body>
</html>

 

0 głosów
odpowiedź 13 września 2020 przez EdeX Gaduła (4,990 p.)
1. Proszę powiedz, że specjalnie napisałeś te błędy ortograficzne

2. Height nie ustawia się w % przynajmniej póki się nie ustali wysokości danego "pudełka" w vh

3. Próbowałeś bottom:0;
komentarz 13 września 2020 przez Robot 12 Początkujący (340 p.)

@EdeX, bottom:0; nie działa

#stopka
{
	    padding: 0px;
    min-height: 70px;
    background-color: black;
    color: #ececec;
    clear: both;
    bottom:0;
}

A jeżeli chodzi o błędy mam dysortografie.

1
komentarz 13 września 2020 przez KosaTV Obywatel (1,260 p.)
Nie działa bo nie ustawiłeś pozycji. Dodaj to:

position: absolute;

W tedy bottom zadziała.
komentarz 13 września 2020 przez Robot 12 Początkujący (340 p.)

Dodałem i nic się nie zmieniło oprócz tego że musiałem dodać  width: 100% bo inaczej stopka była w rogu.

;#stopka
{
        padding: 0px;
    min-height: 70px;
    background-color: black;
    color: #ececec;
    clear: both;
    width: 100%;
    position: absolute;
    bottom:0;
}

 

1
komentarz 13 września 2020 przez KosaTV Obywatel (1,260 p.)
Czy ta stopka "siedzi" w czymś?
komentarz 13 września 2020 przez Robot 12 Początkujący (340 p.)

w container

<!DOCTYPE HTML>
<html lang="pl">
<head>
	<meta charset="utf-8" />
	<link rel="shortcut icon" href="imige/logo.png">
	<title>Polski RoolPlay Discord</title>
	<meta name="description" content="Strona serwera Polski RoolPlay Discord" />
	<meta name="keywords" content="PRD,RP,POLSKI,polska" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	
	<link rel="stylesheet" href="index.css" type="text/css">
</head>
<body>

	<div id="container">
		<div id="pasek_gura">
			<div id="logo">
					<img src="imige/logo.png" width="150" height="90" />
			 </div>
			 <a href="Kontakt.html">
			    <div id="Kontakt">
					<h1>Kontakt</h1>
			    </div>
			 </a>
			 <a href="Wspierajacy.html">
			    <div id="Wspierajoncy">
					<h1>Wspierający</h1>
			    </div>
			 </a>
			 <a href="Poradnik.html">
			    <div id="Poradniki">
					<h1>Poradniki</h1>
			    </div>
			 </a>
			<a href="index.html">
				<div id="home">
					<h1>Home</h1>
				</div>
			</a>
		</div>
		<div>
		    
		    
		</div>
		<div id="stopka">
		    <h6><p style="text-align: center"><br>Wszelkie prawa zastrzeżone ©<br>Autor: Robot 12</p></h6>
		</div>
	</div>

</body>
</html>

 

1
komentarz 13 września 2020 przez KosaTV Obywatel (1,260 p.)

@Robot 12, Usuń ten średnik obok #stopka. Przeglądarka nie wie o co ci chodzi.

komentarz 13 września 2020 przez Robot 12 Początkujący (340 p.)
Przez przypadek go wklejałem go tam nie ma w kodzie.

Podobne pytania

0 głosów
5 odpowiedzi 5,261 wizyt
pytanie zadane 11 listopada 2015 w HTML i CSS przez Duduś Początkujący (380 p.)
0 głosów
1 odpowiedź 72 wizyt
pytanie zadane 16 maja 2020 w HTML i CSS przez Goszczu31 Nowicjusz (160 p.)
0 głosów
2 odpowiedzi 79 wizyt
pytanie zadane 24 kwietnia w HTML i CSS przez FabQ Początkujący (430 p.)

85,873 zapytań

134,644 odpowiedzi

298,914 komentarzy

56,740 pasjonatów

Advent of Code 2021

Top 15 użytkowników

  1. 926p. - rucin93
  2. 925p. - Whistleroosh
  3. 912p. - nidomika
  4. 876p. - adrian17
  5. 867p. - Michal Drewniak
  6. 866p. - Mikbac
  7. 863p. - Mateusz Bogdan
  8. 859p. - CC PL
  9. 797p. - Argeento
  10. 704p. - ScriptyChris
  11. 683p. - tokox
  12. 660p. - Vinox
  13. 645p. - TheLukaszNs
  14. 642p. - s. Dorota Kowalewska
  15. 628p. - WhiskeyTaster
Szczegóły i pełne wyniki

Motyw:

Akcja Pajacyk

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

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

...