Archief - CSS: Margin-top niet aanpasbaar bij h2

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.

brecko

Legacy Member
Code:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Bloemen Lissens - Home</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>

<body>

<div id="wrapper">

	
	<div id="menu">
		
		<ul>		
			<li><a href="#"><img src="img/menu/home.png" alt="home" />&nbsp Home</a></li>
			<li><a href="#"><img src="img/menu/voordelen.png" alt="voordelen" />&nbsp Voordelen</a></li>
			<li><a href="#"><img src="img/menu/hoe.png" alt="hoe" />&nbsp Hoe bestellen?</a></li>
			<li><a href="#"><img src="img/menu/catalogus.png" alt="catalogus" />&nbsp Catalogus</a></li>
			<li><a href="#"><img src="img/menu/contact.png" alt="contact" />&nbsp Contact</a></li>			
		</ul>	
	
	
	</div>

	
 	
  <div id="content"> 
  
  		<h2>Bloemen Lissens heet U welkom</h2>
	
  </div>	
	
</div>

</body>
</html>

Code:
/* CSS Document */

body	{
		background: url(../img/bg/bg4.png) repeat-x top left;
		font: 1.3em Georgia, Helvetica, Arial, Verdana, sans-serif;
		color: #999;
}
	
img		{
		border: none;
}



#wrapper 	{		
		margin: 150px auto;
		width: 800px; 		
}

#menu 	{	
		float: left;	
		background-color: #83D329;			
		width: 250px;
		
}

#menu ul	{
		display: block;
		list-style: none;
}


#content	{
		background: white;			
		margin-left: 250px;
		width: 550px;
		min-height: 550px;	
}


h2	{
		background-color: #79D23E;
		font: 0.7em Georgia, Arial, Verdana, sans-serif;
		font-style: italic;
		text-decoration: underline;
		color: #fff;
		margin: 5px 5px;
}

#menu a:link 	{text-decoration: none; color: #fff;}
#menu a:visited	{text-decoration: none; color: #fff;}
#menu a:hover 	{text-decoration: underline; color: #fff;}
#menu a:active	{text-decoration: none; color: #fff;}

In mij content kan ik de margin top van h2 niet aanpassen, ziet iemand mijn fout?

Thanks

Xavez

Legacy Member
Ik snap niet wat het iedereen tegenwoordig bezielt om een html document een xml markup tag te geven? Je server stuurt het tóch als html door... Het ligt 9/10 kansen daar aan...

(btw, even later bepaal je in je document zelf dat het om html gaat: <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />--geen touw aan vast te knopen, soms :))

brecko

Legacy Member
hello, ja kweet ni, is voor het eerst dat ik gebruik maak van dreamweaver (ipv good old fashioned textpad). Dus doctype is autommatisch..

Dus, jij denkt, gewoon markup van xml eruit, en problem solved?
Zal het eens toepassen... Verder code ok?

Merci al!

edit: seems to do the trick. Waarom doet Dreamweaver dat dan? :s

Mithrandix

Legacy Member
ik gebruik nu toch al een tijdje dreamweaver ( 8 ) om mijn sites te coden en die heeft mij nog nooit een xml meegegeve ze :/

Disa

Legacy Member
Zet van eerste keer uw doctype ook op strict, anders heeft het weinig nut dat ge in XHTML bezig zijt.

Xavez

Legacy Member
Is misschien iets van de nieuwe CS3 dan? Nuja, je moet dat wel ergens kunnen instellen, denk ik. Ofwel handmatig verwijderen iedere keer =]...

brecko

Legacy Member
Is niet de CS3, maar de MX versie. Maar k blijf nog problemen hebben nu.
Als ik in mijn CSS de margin-top wil wijzigen, neemt hij nu het hele content div mee... Dat schuift dus mee nr onder... Klopt er iets ni aan de code?

adrianhates

Legacy Member
margin gaat zogezegd over het uiterlijke afstand van de div
padding verzorgd de innerlijke afstand ;)

Xavez

Legacy Member
Dat weet ik, maar hij lost z'n probleem op door padding-top te gebruiken :).

brecko

Legacy Member
waarom werkt margin niet in dit geval?
(gewoon maar om te weten hoor) Ik denk dat mij dit in het verleden wel al lukte..

Trouwens, Xavez, jij hebt mij ooit eens gezegd dat padding best te vermijden is omdat IE daar soms lastig over doet. Kan dat dan geen kwaad?

Zero Grav

Legacy Member
Margin werkt soms niet tegoei in browsers (naar eigen ervaringen).

Stel bijvoorbeeld dat je

Code:
<div>
<h1 style="margin-top: 20px;">titel</h1>
<p>tekst</p>
</div>

hebt, dan kan het goed zijn dat niet je titel 20 pixels naar onder verschoven wordt, maar je div zelf. En in dit voorbeeld is het ook goed mogelijk dat de bottom-margin (die automatisch op een p zit) op de div wordt toegepast, ipv op de p zelf.

brecko

Legacy Member
Zero Grav zei:
Stel bijvoorbeeld dat je

Code:
<div>
<h1 style="margin-top: 20px;">titel</h1>
<p>tekst</p>
</div>

hebt, dan kan het goed zijn dat niet je titel 20 pixels naar onder verschoven wordt, maar je div zelf.

Dit is inderdaad het geval, maar ik vind het maar raar, want in het verleden is mij dit al zonder problemen gelukt hoor... (toen nog wel niet met firefox 2)

Xavez

Legacy Member
brecko zei:
Trouwens, Xavez, jij hebt mij ooit eens gezegd dat padding best te vermijden is omdat IE daar soms lastig over doet. Kan dat dan geen kwaad?
Klopt, het is dan ook maar een rule of thumb natuurlijk. In de webdesignwereld waar Microsoft zich moeit, bestaan er geen zekerheden :D.
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan