Forum PHP.pl > [CSS][HTML]Tło i wyśrodkowanie diva

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [CSS][HTML]Tło i wyśrodkowanie diva

Turson

9.07.2010, 11:28:07

Mój CSS:

[HTML] pobierz, plaintext 
body{ 
	background: url(bg.png) repeat;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 75%;
	margin: 0px;
	color: #000000;
}
.menu_gora { 
	background: url(menugora.jpg) repeat-x top;
 
	height: 80;
	padding: 5px;
 
}
.logo { 
margin: 10;
 
 
}
.main { 
background: url(kwadratin.jpg) repeat-x;
position: absolute;
margin-left: auto;
margin-right: auto;
vertical-align: top;
 
 
 
}
[HTML] pobierz, plaintext

HTML:

[HTML] pobierz, plaintext 
<body class="body" id="body">
 
<div id="menu_gora" class="menu_gora"></div>
<div id="logo" class="logo"><center><img src="logo.jpg"></center></div>
<div id="main" class="main"></div>
[HTML] pobierz, plaintext

Pierwszy problem, to to, że div "main" nie wyświetla się to tło, które ma.
Drugi problem, div "main" nie jest wyśrodkowany

cniak

9.07.2010, 11:58:19

css

[HTML] pobierz, plaintext 
body {
background: url('bg.png');
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 75%;
color: #000000;
padding:0;
}
#main {
background: url(kwadratin.jpg) repeat-x;
vertical-align: top;
width:900px;
margin:0px auto;
padding:0;
 
.menu_gora {
background: url(menugora.jpg) repeat-x top;
height: 80px;
padding: 5px;
}
.logo {
margin: 10;
}
[HTML] pobierz, plaintext

html

[HTML] pobierz, plaintext 
<body>
 
<div id="menu_gora" class="menu_gora">tekst</div>
<div id="logo" class="logo"><center><img src="logo.jpg"></center></div>
<div id="main">tekst</div>
[HTML] pobierz, plaintext

W #main usunołem position: absolute. Używanie "position: absolute" nie ma sensu skoro nie użyłeś position: releative. To mogło być przyczyną, jeżeli chcesz cos miec na srodku używaj margin: 0px auto; z dopisaniem jakiejs szerokości, np. width: 900px;. Margin: 0px auto używa się w większości w blokach (div)

Turson

9.07.2010, 16:53:47

Rezultat taki, że menu_gora zniknęło w ogóle
Już wiem, bo nie zamknąłeś }

[HTML] pobierz, plaintext 
Dobra, dodałem nowe
.mgp {
text-align:right;
color:white;
font-size:30px;
padding: 0px;
}
[HTML] pobierz, plaintext

Jako wyswietlanie tekstu w menu_gorne ale po prawej stronie

Oraz html

[HTML] pobierz, plaintext 
<div id="menu_gora" class="menu_gora">teksssssssssssssssssssss<div id="mgp" class="mgp">prawooo</div></div>
[HTML] pobierz, plaintext

Ale wyświetla się niżej

cniak

12.07.2010, 14:39:35

nie mozesz dac text-align: right, tylko float: right. Uzyj tez <div style=" clear: both;"></div>

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.