DIV uitlijnen werkt niet

[Maartenv87]

Ik krijg mijn DIV niet gecentreerd. Weet iemand wat ik fout doe? Is gewoon een embed.

 <div style="width:425px;height:521px;position:relative;" align="center">
<object width="425" height="521">
<param name="movie" value="http://embedr.com/swf/slider/sbs-tuilt-videospeler/425/521/0xff931f/false/std"></param>
<param name="allowFullScreen" value="true"></param>
<param name="wmode" value="transparent">
<embed src="http://embedr.com/swf/slider/sbs-tuilt-videospeler/425/521/0xff931f/false/std" type="application/x-shockwave-flash" allowFullScreen="true" width="425" height="521" wmode="transparent"></embed></object>
<a href="http://embedr.com/playlist/sbs-tuilt-videospeler" target="_blank" style="background:transparent url(http://embedr.com/img/embedr-custom-video-playlists.gif);float:right;margin:0;padding:0;outline:none;width:115px;height:35px;position:relative;top:-35px;z-index:99;"></div>

 

[AndreazZz]

Wat gebeurt er precies, staat hij net niet in het midden of staat hij gewoon links uitgelijnd? Probeer anders eens Align="right" en kijk dan of hij rechts komt.

 

[Maartenv87]

Staat helemaal links, align="right" ook al uitgeprobeerd.

 

[csshunter]

De align="center" is achterhaalde/afgekeurde html; dat zou moeten zijn: style="text-align: center".
Maar met deze eigenschap wordt gecentreerd wat binnen een div staat.

Als een <div> met een bepaalde breedte zelf in het midden moet komen, moet deze een {margin: 0 auto;} krijgen, dan wordt de overblijvende ruimte keurig automatisch tussen links en rechts verdeeld.

Met vriendelijke groet,
CSShunter

 

[VascoF]

"align: center" is een atribut wat niet meer werkt. Ik centreer mijn div elementen altijd door zowel de linker als de rechter margin de "auto" atribuut te geven. de oplossing van csshunter werkt inderdaad heel erg goed echter ik geef er de voorkeur aan om alle vier de margin quadranten los te specifieren. dus margin-top, margin-right, margin-bottom en margin-left waarbij de right en left op auto staan. Op die manier heb je ook controle over de waardes van top en bottom die dan ook precies mogen zijn wat je wilt.

 

[csshunter]

Ja, kan ook. Als de top en bottom van een margin niet nul zijn, gebruik ik meestal de verkorte css-schrijfwijze *):

#idvandediv {
    margin: 15px auto 10px auto;
    }

Dit gaat dan met de klok mee: op 12 uur beginnen met de top (15px), dan de right (auto), dan de bottom (10px), en tenslotte de left (auto).

Voor bv. paddings kan dat op dezelfde manier in een verkorte notatie.

PS @Maartenv87: leuke nieuwe kiekjes op de tuilt-homepage.

Met vriendelijke groet,
CSShunter
________
*) Want (a) wat minder css = snellere pagina, (b) bij veel css overzichtelijker (minder scrollen nodig), en (c) ik ben lui!

 

[VascoF]

inderdaad... ik heb daar een heel erg leuk ezelsbruggetje voor : "12 o'clock trouble " toepasbaar voor alles wat met blokken te maken heeft dus niet alleen de margins.

 

[Maartenv87]

Beide werken, ik heb voor deze van CSShunter gekozen, bedankt jongens!