Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [CSS][HTML]Tło i wyśrodkowanie diva
Turson
post 9.07.2010, 11:28:07
Post #1





Grupa: Zarejestrowani
Postów: 4 291
Pomógł: 829
Dołączył: 14.02.2009
Skąd: łódź

Ostrzeżenie: (0%)
-----

Mój CSS:
[HTML] pobierz, plaintext 
  1. body{ 
  2. 	background: url(bg.png) repeat;
  3. 	font-family: Arial, Verdana, Helvetica, sans-serif;
  4. 	font-size: 75%;
  5. 	margin: 0px;
  6. 	color: #000000;
  7. }
  8. .menu_gora { 
  9. 	background: url(menugora.jpg) repeat-x top;
  10.  
  11. 	height: 80;
  12. 	padding: 5px;
  13.  
  14. }
  15. .logo { 
  16. margin: 10;
  17.  
  18.  
  19. }
  20. .main { 
  21. background: url(kwadratin.jpg) repeat-x;
  22. position: absolute;
  23. margin-left: auto;
  24. margin-right: auto;
  25. vertical-align: top;
  26.  
  27.  
  28.  
  29. }
[HTML] pobierz, plaintext

HTML:
[HTML] pobierz, plaintext 
  1. <body class="body" id="body">
  2.  
  3. <div id="menu_gora" class="menu_gora"></div>
  4. <div id="logo" class="logo"><center><img src="logo.jpg"></center></div>
  5. <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
Go to the top of the page
+Quote Post
cniak
post 9.07.2010, 11:58:19
Post #2





Grupa: Zarejestrowani
Postów: 169
Pomógł: 12
Dołączył: 16.09.2009

Ostrzeżenie: (0%)
-----

css
[HTML] pobierz, plaintext 
  1. body {
  2. background: url('bg.png');
  3. font-family: Arial, Verdana, Helvetica, sans-serif;
  4. font-size: 75%;
  5. color: #000000;
  6. padding:0;
  7. }
  8. #main {
  9. background: url(kwadratin.jpg) repeat-x;
  10. vertical-align: top;
  11. width:900px;
  12. margin:0px auto;
  13. padding:0;
  14.  
  15. .menu_gora {
  16. background: url(menugora.jpg) repeat-x top;
  17. height: 80px;
  18. padding: 5px;
  19. }
  20. .logo {
  21. margin: 10;
  22. }
[HTML] pobierz, plaintext


html
[HTML] pobierz, plaintext 
  1. <body>
  2.  
  3. <div id="menu_gora" class="menu_gora">tekst</div>
  4. <div id="logo" class="logo"><center><img src="logo.jpg"></center></div>
  5. <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)

Ten post edytował cniak 9.07.2010, 12:01:42
Go to the top of the page
+Quote Post
Turson
post 9.07.2010, 16:53:47
Post #3





Grupa: Zarejestrowani
Postów: 4 291
Pomógł: 829
Dołączył: 14.02.2009
Skąd: łódź

Ostrzeżenie: (0%)
-----

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


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

Jako wyswietlanie tekstu w menu_gorne ale po prawej stronie

Oraz html
[HTML] pobierz, plaintext 
  1. <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

Ten post edytował TursoN 9.07.2010, 17:27:32
Go to the top of the page
+Quote Post
cniak
post 12.07.2010, 14:39:35
Post #4





Grupa: Zarejestrowani
Postów: 169
Pomógł: 12
Dołączył: 16.09.2009

Ostrzeżenie: (0%)
-----

nie mozesz dac text-align: right, tylko float: right. Uzyj tez <div style=" clear: both;"></div>
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 19.07.2025 - 13:06
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn