Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Wyśrodkowanie diva
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
Siner
6.09.2005, 17:10:36
Mam problem z wyśrodkowaniem diva, pisze taki kod:
[HTML] pobierz, plaintext 
  1. <div style="margin-left: auto; margin-right: auto;">
[HTML] pobierz, plaintext

Ale pod IE niestety to nie dziła. Jest jakiś inny sposób na wyśrodkowanie diva ?
Kill3R
6.09.2005, 17:23:23
witam

bylo o tym wiele razy na forum

przyklad

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <style type="text/css">
  4. html, body {
  5. margin: 0;
  6. padding: 0;
  7. text-align: center /* srodkowanie dla ie */
  8. }
  9. div#allBox {
  10. margin: 0 auto; /* to dla innych przegladarek  - skrocony zapis zero to gora i dol auto lewy i prawy*/
  11. width: 750px;
  12. height: 500px;
  13. text-align: left; /* wyrownanie tectu w divie do lewej */
  14. }
  15. </style>
  16. </head>
  17. <body>
  18. <div id="allBox">
  19. tresc diva
  20. </div>
  21. </body>
  22. </html>
[HTML] pobierz, plaintext
Siner
6.09.2005, 19:13:18
No ale ja nie chcem mieć wszystkich teksotw znajudujacych sie w divie na środku.
A ta linijka na to wpływa. 
[XML] pobierz, plaintext 
  1. text-align: center
[XML] pobierz, plaintext

Chcem mieć sam div na środku. Nawet jasli mam przy <p> styl "margin-left: 280px;" to i tak jest na środku.
FiDO
6.09.2005, 19:20:12
No to musisz otoczyc tylko tego diva, ktorego chcesz wycentrowac, pomocniczym divem i z nim postapic analogicznie.
Siner
6.09.2005, 20:05:45
Jednak prosiłbym o przykład, bo kąbinuje i mi nie wychodzi winksmiley.jpg
Kod strony wygląda mniejwiecej tak:
[HTML] pobierz, plaintext 
  1. <div style="width: 381; border: 1px solid #859C32; margin-left: auto; margin-right: auto;" id="layer1 ">
  2. <div style="width: 381;"><img src="13_21.gif"></div>
  3. <div class="tytul"><p class="tytul">Test</p>
  4. <p class="tresc">Test </p>
  5. </div>
  6. <div class="stopka">Siner</div>
  7. </div>
[HTML] pobierz, plaintext

I jak zrobić aby <div>(layer1) był na środku strony. Także po IE, ale teskt się nię centrował.
php programmer
6.09.2005, 20:34:56
można też zrobić tak:

Kod
position: absolute;
left: 50%;
margin-left: -połowa_długości_Diva;
width: długość_Diva
Kill3R
6.09.2005, 20:36:13
witam ponownie

[HTML] pobierz, plaintext 
  1. <div style="text-align: center;">
  2. <div style="width: 381; border: 1px solid #859C32; margin-left: auto; margin-right: auto; text-align: left;" id="layer1 ">
  3. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur pellentesque enim et odio. Morbi nulla augue, molestie tempor, tincidunt ut, 
  4. euismod vitae, nulla. Proin et lorem vel libero ullamcorper luctus. Ut sagittis dui at nunc. Nam eget arcu nec tortor ultrices luctus. Integer eget 
  5. sapien. Aliquam hendrerit tellus ac diam. Etiam a quam vel metus scelerisque malesuada. Quisque felis ipsum, mattis eu, vulputate non, dapibus eget, p
  6. urus. Nunc vel dolor at nunc nonummy tristique. Morbi sodales urna vitae arcu. Integer pellentesque pellentesque dolor. Pellentesque habitant morbi 
  7. tristique senectus et netus et malesuada fames ac turpis egestas. Aenean eget neque et risus congue fermentum.</p>
  8.  
  9.  
  10. </div>
  11. </div>
[HTML] pobierz, plaintext


juz widzisz o co chodzi??
pierwszy div ma text-align: center dla Internet explorera

a w drugim jest margin-left i right auto dla np firefoxa ale w drugim tez jest text-align: leftdla zawartosci tego drugiego diva

---------------
@revyag
w moim pierwszym przykladzie jest margin: 0 auto; :-)
w drugim przxykladzie poprawialem kod sinera wiec nie zmienialem marginów :-)
Siner
6.09.2005, 21:10:05
Dzięki poskutkowało. Najśmiesznijsze, ze juz wcześniej tak kąbinowałem, tylko źle to wcisnąłem w kodzie smile.gif
revyag
7.09.2005, 10:29:01
Taka mała uwaga snitch.gif
Wystarczy marign: 0 auto.
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.
Invision Power Board © 2001-2025 Invision Power Services, Inc.