Forum PHP.pl > Kiedy centrowanie w IE nie dziala...

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: Kiedy centrowanie w IE nie dziala...

Forum PHP.pl > Forum > Po stronie przeglądarki > CSS

Sky_walker

5.02.2008, 19:44:17

Witam, mam prostą stronkę:

[HTML] pobierz, plaintext 
<body>
<div id="lay">aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa
</div>
</body>
[HTML] pobierz, plaintext

i do niej styl CSS:

Kod

body {
  background-color: #ffffff;
  font-size: 12px;
  font-family: Tachoma, Arial, Helvetica, sans-serif;
  color: #000000;
}

#lay {
  margin: auto;
  width:                 900px;
  background-color:      red;

}

Według wszelkich samouczków, tutoriali, porad, Wszystko co chcesz wiedzieć o centrowaniu w CSS etc. itp. margin: auto; lub margin-left:auto; margin-right:auto; powinno dać w IE i FF wycentrowanie czerwonego div'a.
Niestety, odpalam niniejszą stronkę w IE 7.0 i div lata po lewej.
Ktoś spotkał się z tym problemem? Jak to poprawić?

nevt

5.02.2008, 19:58:51

Cytat

Według wszelkich samouczków, tutoriali, porad

oj... niewiele ich było... niewiele...
o quirks mode w IE sie nie czytało...
dodaj do HTML odpowiednie nagłówki z definicją typu dokumentu i IE okaże się bardziej skłonny do współpracy

EDIT: pierwsza diagnoza błędna...

punkomuzykant

5.02.2008, 20:19:52

a ja tam się nie znam

ale to bankowo się przyda. Podejrzyj źródło i będziesz wiedział
W3C

heh po 3 latach wracam do html i przyznam szczerze że czytanie dokumentacji i domyslanie się co działać będzie a co nie jest trudniejsze i bardziej pracochłonne od programowania w actionscript flasha

ps. te wszystkie tutki itp w większości przypadków są dawno nieaktualne a samo
margin: auto jest chyba określone jako deprecated poczytaj

slaw.omir

6.02.2008, 09:42:15

Wystarczy zrobić wycentrowanie tekstu, w IE zadziała i wycentruje wszystkio, a w FF nie. W FF wystarczy wpisać w #lay margin: 0
"odległość od górnej krawędzi przeglądarki" auto "odległość od lewej i prawej krawędzi przeglądarki"

[HTML] pobierz, plaintext 
body {
    text-align:center;
}
#lay {
  margin:0 auto;
  }
[HTML] pobierz, plaintext

Sky_walker

6.02.2008, 18:01:13

Wielkie dzieki slaw.omir - działa bez zarzutu

ps. Gratuluje pierwszego znaczka "pomógł"

nevt

6.02.2008, 20:22:14

przykro to pisać - ale sposób podany przez slaw.omira to nie pomoc tylko "obejście" problemu. twój IE dalej pracuje w trybie QUIRKS i za chwilę znowu przekonasz się, że coś ci wyświetla zupełnie inaczej niż pozostałe przeglądarki. wrzuć w google: IE quirks mode i poczytaj o tym więcej, bo inaczej twoje problemy z wyświetlaniem w IE będą się nieustannie powtarzać...

a przy okazji polecam stronkę: Lista bugów przeglądarek (głównie Explorera)

bardzo pouczająca lektura, uświadomisz sobie jakim wyzwaniem jest robienie stron identycznie wyglądających na różnych przeglądarkach...

punkomuzykant

11.02.2008, 09:40:22

nevt ciekawą stronkę podałeś. Mi też się przyda więc dzięki

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.