Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [css] nie mogę wycentrować diva pod ie
Forum PHP.pl > Forum > Po stronie przeglądarki
Arek00
banalny przykład: jeden div. pod ff wyświetla się prawidłowo na środku strony a pod ie po lewo... działająca strona: http://wmd6.ovh.org/test/

kod strony:
  1. <meta http-equiv="Content-Type" content="text/html;CHARSET=utf-8">
  2. <link href="stylesheet.css" rel="stylesheet" type="text/css">
  3. </head>
  4.  
  5.  
  6. <div class="main">
  7. test asdf asdf
  8. </div>
  9.  
  10. </body>
  11. </html>


css:
Kod
body {
     background-color: #6B9FD0;
     color: #ffffff;
     font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 10px;
}
.main {
     margin: auto;
     width: 825px;
     background: #476B8D;
     padding: 10px;
     font-size: 15px;
}


jak to poprawić?
mike
Pod IE musisz dodać:
Kod
body {
    text-align: center;
}

.main {
    text-align: left; /* "dla naprawienia", żeby nie centrować tekstu */
}
kamil4u
Albo (IMO lepszy sposób) dodaj Doctype(strict) smile.gif
mike
Cytat(kamil4u @ 28.02.2009, 15:12:18 ) *
Albo (IMO lepszy sposób) dodaj Doctype(strict) smile.gif
Dobry sposób na to by ... nic się nie zmieniło tongue.gif
kamil4u
Dlaczego negujesz moje rozwiązanie? Nie rozumiem o co Ci chodzi, może byś tak sprawdził moje rozwiązanie jak o nim nie słyszałeś, a nie od razu piszesz "nic się nie zmieni". Następnym razem z łaski swojej sprawdzaj cudze rozwiązania, zanim od razu będziesz pisał bzdury(ładnie proszę smile.gif ).

Żeby nie było:
- http://www.quirksmode.org/css/quirksmode.html --> patrz: margin and width: auto --> In IE Windows this only works in strict mode.
- http://forum.pcformat.pl/thread-113308-pos....html#pid841690 <-- przykład z forum, że działa

Pozdrawiam
mike
Cytat(kamil4u @ 28.02.2009, 16:02:17 ) *
Dlaczego negujesz moje rozwiązanie?
Dlatego:
Kod
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>TestPage</title>
        <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />

        <style type="text/css">
            <!--
            body { background-color: #f00; }

            #wrapper {
                margin: auto;
                width: 100px;
                height: 100px;
                background-color: #00f;
            }
            -->
        </style>
    </head>
    <body>
        <div id="wrapper"></div>
    </body>
</html>
Internet Explorer 6.0 nie centruje bloku #wrapper a to jest poprawna deklaracja dokumentu XHTML.

Zadziała tylko pod warunkiem, że usuniesz:
Kod
<?xml version="1.0" encoding="utf-8"?>

Co oznacza, że obaj mieliśmy rację z czego ja idę z duchem postępu, Ty nie tongue.gif Więc zanim zaczniesz pisać cokolwiek o bzdurach doczytaj sobie tongue.gif
kamil4u
Jakby nie patrzeć autor tematu pisał w HTML, a nie w XHTML i gdy doda Doctype div zostanie wyśrodkowany - więc nie wiem dlaczego się nie zgadzałeś.

Cytat
Co oznacza, że obaj mieliśmy racj

Wcześniej się ze mną nie zgodziłeś smile.gif
Cytat
rację z czego ja idę z duchem postępu, Ty nie

Wycofali HTML? To, że coś jest nowsze nie znaczy, że trzeba z tego korzystać - ja używam HTML i jakoś nigdy mi to nie przeszkodziło w zrobieniu strony smile.gif - każdy z nas ma wybór z czego korzystać, a z czego nie tongue.gif
Cytat
Więc zanim zaczniesz pisać cokolwiek o bzdurach doczytaj sobie

To Ty zaprzeczyłeś, że moje rozwiązanie zadziała - a dodając DTD ..... - nic co napisałem nie było nieprawdą (przynajmniej w tym temacie tongue.gif)

Dobrze, że w końcu doszliśmy do jakiegoś porozumienia smile.gif

Pozdrawiam
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.