Scripts - Tutorials - Forum - Downloads - Showcase - Contact

Artikels

VPN vergelijken

Algemeen

Beginpagina

FAQ

Grafische worm (243)

Links

Nieuwsartikels

Nieuwsarchief

Boeken programmeren

Overzicht

Samenwerken

Webhosting

Zoek op Sitemasters

Leden

Registreren

Ledenlijst

Ons team

Links

webhostingtop10.be

Sociale media

Follow @sitemasters

Sitemasters

Adverteren op Sitemasters?

Contacteer ons

RSS

Link naar ons

Donaties

Poll

Je moet ingelogd zijn om te stemmen.

Statistieken

Linkpartners

Forum

Categorieën > HTML & CSS

[css] margin:auto

endymion - 14/09/2004 18:57
Lid		kan iemand mij vertellen waarom die margin:auto het niet doet? <html> <head> <STYLE TYPE="text/css"> <!-- .kader { margin: auto; border: solid 1px #000000; width: 700px; background-color: #D3D5DE; height: 200px; } --> </style> <body> <P CLASS="kader"> </p> </body> </html>

18 antwoorden

Gesponsorde links

Fenrir - 14/09/2004 20:23
PHP expert		waarom wil je het op auto zetten, en wat doet het niet??

Gml - 14/09/2004 20:28 (laatste wijziging 14/09/2004 20:28)
HTML beginner		p.margin {margin-left: auto} met het bovenstaande hoef je niet een class aan je P te geven

endymion - 14/09/2004 20:36
Lid		ok GmL. nou hier ff de code... wat ik wil, die kader moet int midden van me beeldscherm komen.. maar hij blijft maar aan de linker kant... iemand anders zei nou net moet je margin-left en margin-right doen zoals ik nu heb maar doet het ook niet :S <html> <head> <STYLE TYPE="text/css"> <!-- .kader { margin-left:auto; margin-right: auto; padding: 5px; border: solid 1px #000000; font-family: arial; width: 700px; background-color: #D3D5DE; height: 500px; } } --> </style> <body> <P CLASS="kader"> <div width="200">hoi </div> </p> </body> </html>

Gml - 14/09/2004 20:44 (laatste wijziging 14/09/2004 20:49)

HTML beginner

Bij mij staat het nu horizontaal in het midden, alleen verticaal nog niet. Als je ook verticaal wilt moet je dit doen:

php code - Bekijk de code zonder highlighting - Klap code in

                <html>
<head>
<STYLE TYPE="text/css">
<!--
.kader{ margin-left:auto; margin-right: auto;  margin-top: 10%; border: solid 1px #000000; font-family: arial; width: 700px;
background-color: #D3D5DE; height: 500px; }
-->
</style>

<body>
<P >

<div CLASS="kader" width="200">hoi</div>
</p>

</body>
</html>
            
<html>
<head>
<STYLE TYPE="text/css">
<!--
.kader{ margin-left:auto; margin-right: auto;  margin-top: 10%; border: solid 1px #000000; font-family: arial; width: 700px;
background-color: #D3D5DE; height: 500px; }
-->
</style>
 
<body>
<P >
 
<div CLASS="kader" width="200">hoi</div>
</p>
 
</body>
</html>
 

En inderdaad p.margin werkt niet, beetje gek

edit: ik zie nu dat het niet werkt in Internet Explorer

, ik gebruik Mozilla daar werkt het dus wel in.

endymion - 14/09/2004 20:49
Lid		nouw vaag hoor.. bij mij wil hij niet centreren horizontaal :S

Gml - 14/09/2004 20:49 (laatste wijziging 14/09/2004 20:52)
HTML beginner		.kader{ margin-left:22%; margin-top: 10%; border: solid 1px #000000; font-family: arial; width: 700px; background-color: #D3D5DE; height: 500px; } Dit werkt hierboven net getest in Internet Explorer. Je moet een beetje met de procentjes spelen. edit: ik zie net dat ie vaag gaat doen als je gaat resizen....:s, ff w8e

Gml - 14/09/2004 20:56

HTML beginner

ok dit is dan niet met een css in het midden gezet maar met een tabelindeling:

php code - Bekijk de code zonder highlighting - Klap code in

<html>
<head>
	<title></title>
	<STYLE TYPE="text/css">
<!--
.nothing 
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0px;
}
-->
</style>
</head>
<body>
<table width="100%" height="100%" border="1">
		<tr>
			<td width="*" class="nothing">&nbsp;</td>
			<td width="*" class="nothing">&nbsp;</td>
			<td width="*" class="nothing">&nbsp;</td>
		</tr>
		<tr>
			<td width="*" class="nothing">&nbsp;</td>
			<td height="450" width="650">

<!-- Begin  --->														
				Met de waardes "450" en "650" kun je spelen om een goed formaat te krijgen
				
				Hier stop je verder je info

<!-- End --->
				
			</td>
			<td width="*" class="nothing">&nbsp;</td>
		</tr>
		<tr>
			<td width="*" class="nothing">&nbsp;</td>
			<td width="*" class="nothing">&nbsp;</td>
			<td width="*" class="nothing">&nbsp;</td>
		</tr>
	</table>
</body>
</html>

<html>
<head>
	<title></title>
	<STYLE TYPE="text/css">
<!--
.nothing 
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0px;
}
-->
</style>
</head>
<body>
<table width="100%" height="100%" border="1">
		<tr>
			<td width="*" class="nothing">&nbsp;</td>
			<td width="*" class="nothing">&nbsp;</td>
			<td width="*" class="nothing">&nbsp;</td>
		</tr>
		<tr>
			<td width="*" class="nothing">&nbsp;</td>
			<td height="450" width="650">
 
<!-- Begin  --->														
				Met de waardes "450" en "650" kun je spelen om een goed formaat te krijgen
 
				Hier stop je verder je info
 
<!-- End --->
 
			</td>
			<td width="*" class="nothing">&nbsp;</td>
		</tr>
		<tr>
			<td width="*" class="nothing">&nbsp;</td>
			<td width="*" class="nothing">&nbsp;</td>
			<td width="*" class="nothing">&nbsp;</td>
		</tr>
	</table>
</body>
</html>

endymion - 14/09/2004 21:09
Lid		haha. ik wil juist van de tabellen af lees http://www.hotdesign.com/seybold/ maar eens.

Gml - 14/09/2004 21:15 (laatste wijziging 14/09/2004 21:18)
HTML beginner		hmm, kweenie hoor, dan ben ik nog van de oude garde :S

endymion - 14/09/2004 21:16
Lid		ja ik dus ook ;) ik had vandaag problemen met me tabels.. en ik ging vragen, en bijna iedereen zei "waarom werk je in godsnaam met tabellen nog" schijnt dus oud te worden ja. daarom ben ik met CSS bezig nu, alleen is dat nog best moeilijk

Gml - 14/09/2004 21:19
HTML beginner		Ja weer lekker want IE, Mozilla of Opere ondersteund dan weer dingen niet. Maar ik ga het wel proberen, moet kunnen namelijk...

endymion - 14/09/2004 21:25
Lid		Yo hij doet ut heb dit bovenin de paginacode gezet: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> kwist nie dat dat moest :S

Gml - 14/09/2004 21:30 (laatste wijziging 14/09/2004 21:31)
HTML beginner		aah zon W3C standaard, ja idd... Maare je hebt nu een xhtml1-strict.dtd, je hebt ook een loose.dtd, dan is het minder strikt, moet je even kijken.

BladiN - 14/09/2004 21:33
Grafische gevorderde		transitional is standaard

endymion - 14/09/2004 21:34
Lid		aha ja die regel heb ik uit de source van een andere website gejat, weet ook absoluuuut niet wat het allemaal inhoud :S maarum GmL. Laatste vraagje... ik heb mijn code nu online op www.c-jochemsen.nl/test.php de bedoeling is, om het design te krijgen zoals op www.c-jochemsen.nl/index.php dat design is uit een zooi tabellen gemaakt.. en het MOET kunnen om alles met CSS te doen. of zeg jij dat dat niet echt mogelijk is? want links heb ik een menu, en rechts het hoofdvlak waar alle inhoud komt.. dat moet dus naast elkaar staan.. moet ik dat met div doen?

Gml - 14/09/2004 21:56 (laatste wijziging 14/09/2004 21:58)
HTML beginner		Moet zeker kunnen, dat moet je idd met div doen. Die kun je dan weer positioneren. zoiets krijg je dan: .main { position:absolute; left:100px; top:150px; } PS: kijk ook hoe de site in andere browsers eruit ziet, kan nog welles verschillen

endymion - 14/09/2004 22:22
Lid		hmm.. stel ik wil een div in die kader hebben die ik op www.c-jochemsen.nl/test.php heb.. dan zet ik : .main { position:absolute; left:100px; top:150px; border:1px; } in de stylesheet... en dan roep ik die div aan precies zoals ik die kader opriep? als ik <div CLASS="main"></div> <div CLASS="kader" width="200"> </div> in de body zet dan gebeurd er niks met die "main".

Gml - 14/09/2004 22:23 (laatste wijziging 14/09/2004 22:23)
HTML beginner		yep je moet hem idd wel tussen de style tags zetten in de head

Gesponsorde links

Dit onderwerp is gesloten.

Actiefste leden van de maand

Actieve forumberichten