[Résolue]Problème positionnement top / left ...

Bonjour,

Alors voilà j'ai des soucis avec les position de mes éléments :

Voici les erreurs ( avec l'extension WebDevelopper pour Firefox ):

Avertissement : Erreur d'analyse de la valeur pour « top ».  Déclaration abandonnée.
Fichier Source : file:///Design/WebDesign/Template/css/design.css
Ligne : 147

Avertissement : Erreur d'analyse de la valeur pour « left ».  Déclaration abandonnée.
Fichier Source : file:///Design/WebDesign/Template/css/design.css
Ligne : 148

Avertissement : Erreur d'analyse de la valeur pour « top ».  Déclaration abandonnée.
Fichier Source : file:///Design/WebDesign/Template/css/design.css
Ligne : 156

Etc, à chaque fois la même erreur.



Ligne correspondante CSS :

.corner_left_top
{
	background-image: url("3.png");
	position:absolute;
	top:50px;
	left:10px;
}

.corner_right_top
{
	background-image: url("1.png");
	position:absolute;
	top:50px;
	left:500px;
}

.vertical_left
{
	background-image: url("2.png");
	background-repeat: repeat-y;
	position:absolute;
	top:60px;
	left:10px;
}

.vertical_right
{
	background-image: url("2.png");
	background-repeat: repeat-y;
	position:absolute;
	top:60px;
	left:500px;
}

.horizontal_top
{
	background-image: url("7.png");
	background-repeat: repeat-x;
	position:absolute;
	top:50px;
	left:30px;
}

.horizontal_bottom
{
	background-image: url("6.png");
	background-repeat: repeat-x;
	position:absolute;
	top:150px;
	left:10px;
}

.corner_left_bottom
{
	background-image: url("4.png");
	position:absolute;
	top:500px;
	left:10px;
}

.corner_right_bottom
{
	background-image: url("5.png");
	position:absolute;
	top:500px;
	left:4000px;
}

Puis le code (X)HTML correspondant:

					<span class="corner_left_top"></span>
					<span class="corner_right_top"></span>
					<span class="corner_left_bottom"></span>
					<span class="corner_right_bottom"></span>
					<span class="horizontal_top"></span>
					<span class="horizontal_bottom"></span>
					<span class="vertical_left"></span>
					<span class="vertical_right"></span>

De plus, on ne les voit pas sur le design.
Mais le problème majeure est qu'il "comprend" pas top et left ..



Merci par avance
Modifié par rout (13 Apr 2011 - 13:07)

Bonjour,

La validation CSS c'est très gadget, tu sais.

Tant que le code fonctionne, pas de quoi s'inquiéter. Surtout que le validateur officiel du W3C ne détecte pas d'erreurs.

Bonjour,

un élément positionné en absolute se placera toujours par rapport au dernier parent ayant une position. Le cas échéant, il se placera par rapport au body. Avec ton bout de code, on peut pas vraiment te dire ce qu'il en est, il faudrait un peu plus de contexte.

a écrit :
De plus, on ne les voit pas sur le design.

Oui c'est normal si tu utilises des span vides et qu'en plus tu ne leur donnes pas de largeur ni de hauteur c'est assez difficile d'afficher un background sur un élément qu'on ne voit pas Il faut les mettre en display:block puis leur donner des dimensions.

InpIxelItrust a écrit :
Bonjour,

un élément positionné en absolute se placera toujours par rapport au dernier parent ayant une position. Le cas échéant, il se placera par rapport au body. Avec ton bout de code, on peut pas vraiment te dire ce qu'il en est, il faudrait un peu plus de contexte.

De plus, on ne les voit pas sur le design.
Oui c'est normal si tu utilises des span vides et qu'en plus tu ne leur donnes pas de largeur ni de hauteur c'est assez difficile d'afficher un background sur un élément qu'on ne voit pas Il faut les mettre en display:block puis leur donner des dimensions.

yes, C'est bon j'ai placé les éléments avec succès.

Pour la validation CSS, j'essaie de tout valider avec WebDevelopper.

Merci à vous,
Modifié par rout (13 Apr 2011 - 13:07)