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

question-closed Stopka (footer) pojawiła się prawie na środku strony, a powinna być na samym dole

0 głosów
60 wizyt
pytanie zadane 10 stycznia w HTML i CSS przez użytkownika Krzysiek_34 Gaduła (3,100 punkty)
zamknięte 6 dni temu przez użytkownika Krzysiek_34

Witam.

Stopka (footer) pojawiła się prawie na środku strony, a powinna być na samym dole. Wcześniej stopka była na samym dole strony i  było OK, ale od kiedy wprowadziłem "boczne_menu", to pojawiła się prawie na środku strony. Zauważyłem, że stopka przyczepiła się na samym dole do bocznego menu tuż pod napisem ---> Sport.

<div class="wrapper">

	<div class="panel-1">
			
		<div class="boczne_menu">
			<nav>
				<ul>
							
					<li><a href="muzyka.php">
					<img src="obrazki/muzyka.png" width="32px" height="24px" style="border: 1px solid #000000; position: absolute; left: 14px; top: 14px" />
					Muzyka</a></li>
								
					<li><a href="filmy.php"><div class="margin_top">
					<img src="obrazki/filmy.png" width="32px" height="24px" style="border: 1px solid #000000; position: absolute; left: 14px; top: 62px" />
					Filmy</a></li>
								
					<li><a href="sport.php"><div class="margin_top">
					<img src="obrazki/sport.png" width="32px" height="24px" style="border: 1px solid #000000; position: absolute; left: 14px; top: 110px" />
					Sport</a></li>
								
				</ul>
			</nav>
		</div>				
			
	</div>

	<div class="footer">Strona internetowa &copy; 2017</div>

</div>
body
{
	background-color: #303030;
	font-family: Verdana;
	margin: 0px;
	width: 100%;
	height: 800px;
	position: relative;
}

.wrapper
{
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
}

.panel-1
{
	clear: both;
	width: 1000px;
	height: 322px;
	background: -webkit-linear-gradient(to right, black, white);
	background: -o-linear-gradient(to right, black, white);
	background: -moz-linear-gradient(to right, black, white);
	background: linear-gradient(to right, black, white);
	border-bottom-left-radius:.5em;
	border-bottom-right-radius:.5em;
	position: relative;
}

.boczne_menu
{
	top: 14px;
	overflow: hidden;
	position: relative;
}

nav
{
	width: 190px;
	font-size: 17px;
	line-height: 200%;
	display: block;
}

nav ul
{
	padding: 10px 10px 10px;
	background-color: #000080;
	display: block;
}

nav ul li
{
	text-align: center;
}

nav ul li a
{
	text-decoration: none;
	color: white;
	display: block;
}

nav ul li a:hover
{
	background-color: #BCE27F;
	color: black;
	cursor: pointer;
}

.margin_top
{
	margin-top: 14px;
}

.footer
{
	text-align: center;
	background-color: #222222;
	color: white;
	font-size: 14px;
	position: absolute;
	bottom: 0;
	width: 1000px;
	line-height: 50px;
	margin-left: auto;
	margin-right: auto;
}

Co muszę poprawić w kodzie, aby stopka z powrotem pojawiła się na samym dole strony?

komentarz zamknięcia: Problem został rozwiązany.
komentarz 10 stycznia przez użytkownika shead VIP (116,150 punkty)
Wszystko fajnie, tylko że w kodzie HTML nie widzę kodu z footerem
komentarz 10 stycznia przez użytkownika Krzysiek_34 Gaduła (3,100 punkty)
Sorry, zapomniałem dodać footera do HTML. Zaraz to poprawię.
komentarz 10 stycznia przez użytkownika Krzysiek_34 Gaduła (3,100 punkty)
Teraz jest cały HTML i cały CSS.
komentarz 10 stycznia przez użytkownika jaca121212 Nałogowiec (27,850 punkty)
Ja tu nie widzę aby była przyklejona do bocznego menu

http://jsbin.com/gepenofiko/1/edit?output
1
komentarz 10 stycznia przez użytkownika shead VIP (116,150 punkty)
@Krzysiek od HTML5 istnieje tag <footer>, nie używaj do tego divów...

http://www.w3schools.com/html/html5_new_elements.asp

1 odpowiedź

+1 głos
odpowiedź 10 stycznia przez użytkownika jaca121212 Nałogowiec (27,850 punkty)
edycja 10 stycznia przez użytkownika jaca121212
Jak dodałem diva o clasie  footer do tego kodu HTML to  stopka jest na dole strony.

http://jsbin.com/gepenofiko/edit?html,css,output

wstaw najlepiej  cały kod HTML. i CSS bo może gdzieś indziej leżeć  problem.

@edit:

Zrobiłem ci szkielet strony po wyżej wypisanym kodzie CSS widzę że zaczynasz przygodę z programowaniem

możesz o stylować (o kodować za pomocą CSS ten kod HTML) pod twoje potrzeby jakie chciałeś uzyskać w  wyżej w szablonie kodu.

http://jsbin.com/lesafuveba/1/edit?html,css,output
komentarz 6 dni temu przez użytkownika Krzysiek_34 Gaduła (3,100 punkty)
edycja 6 dni temu przez użytkownika Krzysiek_34
Dzisiaj jednak nie mam czasu się tym zajmować, aby przetestować tego footer.

Mam 2 pytania w tym temacie:

1. W jakim celu umieszczać za obrazkiem taki zapis, np. alt="obraz muzyka", skoro to nie przynosi żadnego efektu?

2. Co muszę dodać w HTML, aby po najechaniu na "Muzyka" pojawiła się pod kursorem chmurka z napisem "Muzyka"? Na stronie https://www.youtube.com jest pokazane po lewej jak to wygląda. Najedźcie kursorem na 'Muzyka', 'Sport', 'Gry' itd, to zobaczycie jak to tam wygląda.

Podobne pytania

0 głosów
5 odpowiedzi 226 wizyt
pytanie zadane 11 listopada 2015 w HTML i CSS przez użytkownika Duduś Początkujący (380 punkty)
0 głosów
3 odpowiedzi 102 wizyt
0 głosów
3 odpowiedzi 67 wizyt
pytanie zadane 23 listopada 2015 w HTML i CSS przez użytkownika barteku12 Użytkownik (580 punkty)
...