Div centreren (margin:auto), content align:left - Softwareontwikkeling

woensdag 4 juni 2008 20:47

Acties:

Nietes

Topicstarter

Hoi, ik ben bezig met een website van de musical fiveguys: http://www.fiveguys.nl. Nu had ik in de eerste instantie de volgende regels:

.mainmain {
margin-left: auto;
margin-right: auto;
}

De div is wel gecentreerd maar in ie6 (...) is de tekst in de div gecenteerd. Nu weet ik inmiddels (denk ik te weten...) dat je de body een text-align: center moet meegeven en de mainmain div weer een text-align: left; (de text-align resetten als het ware). Dit werkt alleen niet.

Verbaasd heb ik toen de hele center van de div (margin-left: auto / margin-right: auto;) er dus uitgesloopt. Toch weet ie6 er text-align: center; van te maken, en die kan ik nergens weervinden in de css... ik wordt er panisch van.

Heeft iemand misschien een idee, of ik iets heel obvious over het hoofd zien? Als het een gevalletje rtfm is, het spijt me oprecht, ik heb gegoogled als een gek en w3c erop nageslagen en doctypes gewisseld... maar niets lijkt te werken

.

Welles

woensdag 4 juni 2008 20:54

Acties:

TeeDee

CQB 241

body: text-align:center, en een margin: 0 auto; op je mainmain (en uiteraard een text-align: left op mainmain.)

Heart..pumps blood.Has nothing to do with emotion! Bored

woensdag 4 juni 2008 21:01

Acties:

Roytoch

Nietes

Topicstarter

Ja, die was ik tijdens het googlen tegengekomen idd, maar als ik die erin stop werkt het dus ook niet:

Cascading Stylesheet:

body {
margin: 0px;
height: 100%;
font-family: Verdana;
color: #000000;
font-size: .8em;
background-color: #fff7e4;
background-image: url(http://www.fiveguys.nl/templates/rhuk_milkyway/img/bg1.jpg);
background-repeat: repeat-x;
background-position: 0px 33px;
text-align: center;
}
.mainmain {
background-image: url(http://www.fiveguys.nl/templates/rhuk_milkyway/img/bg3.jpg);
background-repeat: repeat-y;
width: 880px;
text-align: left; /* counter the body center */
overflow: hidden;
display: block;
margin: 0 auto;
}

Welles

woensdag 4 juni 2008 21:50

Acties:

Borizz

Waarom niet gewoon zo?

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>Center test</title>
    <style type="text/css">
        .main {
            margin-left: auto;
            margin-right: auto;
            width: 880px;
            background: #eeeeff;
            padding: 50px 20px;
        }
    </style>
</head>
<body>
    <div class="main">Deze tekst is gewoon links uitgelijnd..</div>
</body>
</html>

Dus helemaal geen 'text-align: center' op de body, werkt prima hier hoor in IE6.

If I can't fix it, it ain't broken.

woensdag 4 juni 2008 21:53

Acties:

_JGC_

text-align: center / text-align: left hacks zijn alleen voor IE5.5 en lager, IE6 werkt gewoon met margin-left/right: auto. IE5.5 ondersteunt sowieso geen HTML 4.0 strict, dus dat wil je niet ondersteunen, net zoals je geen Netscape 4.0 meer wilt ondersteunen.

woensdag 4 juni 2008 22:01

Acties:

crisp

Devver

Pixelated

In http://www.fiveguys.nl/templates/system/css/general.css :

Cascading Stylesheet:

.img_caption.left p {
    clear: left;
    text-align: center;
}

IE6 ondersteunt geen multiple-class selector en leest dit als:

Cascading Stylesheet:

.left p {
    clear: left;
    text-align: center;
}

Overigens is de text-align: center op de body overbodig voor IE6 in standards compliant mode, enkel IE < 6 heeft dat nodig.

Intentionally left blank

woensdag 4 juni 2008 22:43

Acties:

Roytoch

Nietes

Topicstarter

Mag ik u allen bedanken voor de replies? Uiteindelijk klopte de oplossing van crisp! Ik had 'alle' stylesheets bekeken op :center dingen, behalve general.css... want die stond niet in mijn zelfgemaakte template map. Fiy: het is een joomla 1.5 site, en de fout komt blijkbaar voort uit een fout of verkeerde tag in general.css, en joomla-eigen css bestand.

Super bedankt! Oplossing gevonden

Welles

woensdag 4 juni 2008 23:25

Acties:

TeeDee

CQB 241

Mjah, het is een gewoonte geworden om een body center; icm een margin 0 auto; om het e.e.a heel simpel gecentreerd in IE 5.5 > te krijgen. Laten we het daar maar op houden.

Goed dat het opgelost is. 1 puntje van irritatie: haal of dat filmpje weg, of zorg ervoor dat het een continue iets wordt. Wat is dat reteirritant als het constant opnieuw geladen wordt.

Heart..pumps blood.Has nothing to do with emotion! Bored

donderdag 5 juni 2008 00:01

Acties:

Roytoch

Nietes

Topicstarter

Ja ik weet het, het meest irritante ooit. Opdrachtgever zou filmpje zonder geluid uppen, zodat dat in ieder geval weg is. Hij stond eerst gewoon op handmatig starten maar het moest en zou automatisch gaan... soms zijn ze niet om te praten

Welles

donderdag 5 juni 2008 01:11

Acties:

_Thanatos_

Ja, en kaal

IE 5.5 en lager gewoon niet meer aan denken.
Die 2 bezoekers per jaar hebben dan maar gewoon pech

日本！🎌

donderdag 5 juni 2008 12:42

Acties:

Zakkenwasser

Waarom zet je de style niet om in een extern CSS bestand?

Meer kans op betere weergave omdat je HTML en CSS apart houdt.
en je komt makkenlijker door validatie's heen

PSP 1000 @ 6.60 Pro C2 [+256GB]
PSVita @ Henkaku Enso [+256GB]
3DS @ Luma (B9S) [+160GB]
Nintendo Switch 3.0.1 [+256GB]

donderdag 5 juni 2008 13:05

Acties:

TeeDee

CQB 241

MrJey schreef op donderdag 05 juni 2008 @ 12:42:
Meer kans op betere weergave omdat je HTML en CSS apart houdt.

Care to explain?

en je komt makkenlijker door validatie's heen

Validatie is een middel, geen doel.

Heart..pumps blood.Has nothing to do with emotion! Bored

donderdag 5 juni 2008 14:14

Acties:

_Thanatos_

Ja, en kaal

TeeDee schreef op donderdag 05 juni 2008 @ 13:05:
[...]

Care to explain?

Je wilt vast wel meer dan 1 pagina maken, en toch je styles maar 1 keer willen definieren.

日本！🎌

donderdag 5 juni 2008 14:15

Acties:

TeeDee

CQB 241

_Thanatos_ schreef op donderdag 05 juni 2008 @ 14:14:
[...]
Je wilt vast wel meer dan 1 pagina maken, en toch je styles maar 1 keer willen definieren.

Dat is logisch, maar wat heeft het scheiden van je CSS nu echt voor invloed op de weergave van je site?

_Thanatos_ schreef op donderdag 05 juni 2008 @ 14:25:
Dat valt ook goed te praten:
Als je de HTML en CSS scheidt, is er geen/minder kans dat de styling van pagina tot pagina niet uniform is. Het heeft technisch geen invloed op de weergave, maar in praktijk onherroeppelijk dus wel.
Soort van

Ja, zo kan ik het ook

[ Voor 37% gewijzigd door TeeDee op 05-06-2008 14:26 ]

Heart..pumps blood.Has nothing to do with emotion! Bored

donderdag 5 juni 2008 14:25

Acties:

_Thanatos_

Ja, en kaal

Dat valt ook goed te praten:
Als je de HTML en CSS scheidt, is er geen/minder kans dat de styling van pagina tot pagina niet uniform is. Het heeft technisch geen invloed op de weergave, maar in praktijk onherroeppelijk dus wel.
Soort van

日本！🎌

vrijdag 6 juni 2008 15:41

Acties:

Roytoch

Nietes

Topicstarter

Toch maar even reageren. Dat het gebruiken van externe stylesheets handiger is klopt ook wel, maar! het is een joomla site. De css die in index.php staat, staat dus in een template. Dus alle opmaak die in de index.php zelf staat wordt wel altijd gebruikt.

Welles

vrijdag 6 juni 2008 19:06

Acties:

Borizz

roy.ahuis schreef op vrijdag 06 juni 2008 @ 15:41:
Toch maar even reageren. Dat het gebruiken van externe stylesheets handiger is klopt ook wel, maar! het is een joomla site. De css die in index.php staat, staat dus in een template. Dus alle opmaak die in de index.php zelf staat wordt wel altijd gebruikt.

Des te meer reden om het in een externe stylesheet te stoppen dan i.v.m. snelheid van het laden van je pagina's. De stylesheet wordt namelijk gecached je index.php waarschijnlijk niet.

If I can't fix it, it ain't broken.