28173 sujets

CSS et mise en forme, CSS3

Bonjour,

j'avais cru comprendre que l'héritage des propriétés CSS pour être cassé en surchargeant une propriété. Cependant, mon test ci-dessous ne permet pas le "réinitialement" de mon spacer... Smiley langue
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<style type="text/css">
* {
	margin:0px;
	padding:0px;
}
div.zone p {
	text-indent:40px;
	padding-top:20px;
}
p.spacer {
	clear:both;
	margin:0px;
	padding:0px;
}
</style>
</head>

<body>

	<div class="zone">
		<p>Lorem ipsum dolor sit amet consectetuer eget Donec risus risus lacus. Tellus habitant lobortis Vivamus et justo orci ornare urna hac justo. Condimentum dolor quis vitae ante adipiscing adipiscing sagittis parturient justo tempus. Quis ipsum vel parturient consectetuer enim orci ac id sit nunc. Orci lacus Lorem augue quis nunc Nullam leo et justo vel. Maecenas urna In.</p>
		<p>Netus habitasse Duis risus Curabitur Phasellus Pellentesque dui tempus Sed euismod. Cursus vitae Lorem sem congue orci lacus pretium amet tortor Cras. Sodales volutpat molestie non ipsum dignissim Donec eros tincidunt laoreet sem. Sit Lorem Nullam elit pretium at tellus velit tincidunt adipiscing tortor. Id Curabitur pellentesque In lacinia Morbi quis.</p>
		<p class="spacer"></p>
	</div>
	
</body>
</html>


Est-ce normal ? si oui, comment avoir mon spacer réinitialisé ?
Suis-je obligé de préciser une class à mes <p> standards ?

Merci d'avance Smiley cligne
Modifié par Tchupacabra (10 Jan 2008 - 09:56)
A mon avis, vu que tu définis padding-top et non pas padding pour ton "p" :


p.spacer {

	clear:both;
	margin:0px;
	padding-top:0px;
}

ou

div.zone p {
	text-indent:40px;
	padding:20px 0 0 0;

}
Salut,

Je pense que c'est juste un problème de priorité :
a écrit :
La cascade de CSS définit un ordre de priorité, ou poids, pour chaque règle de style. Quand plusieurs règles sont mises en oeuvre, celle avec le plus grand poids a la préséance.

voir Cascade CSS et priorité des sélecteurs sur Openweb

donc si ta règle est

div.zone p.spacer {
	clear:both;
	margin:0px;
	padding:0px;
}
elle aura la priorité (je te laisse faire le calcul Smiley cligne )

dunjl
Modifié par dunjl (09 Jan 2008 - 17:58)
C'est un problème de spécificité: div.zone p est plus précis que p.spacer, il prend donc la priorité. Pour contrer ceci, tu as plusieurs possibilité, dont simplement cibler ton spacer de manière plus complète:
div.zone p.spacer {}


edit: grillé.
Modifié par Benjamin D.C. (09 Jan 2008 - 17:58)