oujood.com

CSS La propriété : left

La propriété de feuille de style css left permet de spécifier la position horizontale du coin haut gauche de l'élément par rapport à un point.
.......................

chercher |

CSS position gauche Propriété left


La propriété de feuille de style css left permet de spécifier la position horizontale du coin haut gauche de l'élément par rapport à un point.

Définition et utilisation:La propriété left

La propriété CSS "left" permet de définir la position horizontale d'un élément par rapport à son élément parent. Elle peut être utilisée avec des valeurs absolues (en pixels, en pourcentages, etc.) ou relatives (en utilisant "auto" ou "inherit").

Syntaxe générale

La syntaxe générale pour utiliser la propriété "left" est la suivante :

élément {
  left: valeur;
}

Exemples d'utilisation

Voici quelques exemples d'utilisation de la propriété "left" :

/* Positionne l'élément à 10 pixels de la bordure gauche de son parent */
élément {
  left: 10px;
}

/* Positionne l'élément à 20% de la largeur de son parent */
élément {
  left: 20%;
}

/* Positionne l'élément en utilisant la valeur par défaut (auto) */
élément {
  left: auto;
}

Il est important de noter que l'utilisation de la propriété "left" doit être utilisée en conjonction avec d'autres propriétés telles que "position" et "width" pour un résultat optimal.

Sélectionner le code
	p
	{
	  position : absolute;
	  left:5px;
	}
	

Valeurs par défautauto
Inherited: non
Animable : oui En savoir plus sur l'animable
Version: CSS2
Syntaxe JavaScript: object.style.left="50px"

Valeurs de la propriété :

Valeur Description
auto l'explorateur calcule la position automatiquement. Par dfaut
nombre définie la position en px ou cm
% un pourcentage de la position de lélément parent
inherit Indique que le paramètre de la propriété doit être héritée de l'élément parent. Internet Explorer (IE8 y compris) ne supporte pas cette valeur


Prise en charge de la propriété dans les navigateurs

Les numéros figurant dans le tableau indiquent la première version du navigateur qui prend totalement en charge la propriété.

Les numéros suivis de -webkit- indiquent la première version qui fonctionne avec un préfixe.

ExplorateurGoogle ChromeInternet ExplorerFirefoxSafariOpera
Verssion29
21 -webkit-
1128
18 -moz-
9
6.1 -webkit-
7
17

Astuces et conseils pour l'utilisation de la propriété CSS "left"

  1. 1- Utilisez la propriété "position" pour définir le type de positionnement de l'élément. La propriété "left" ne fonctionnera que si l'élément a un positionnement "absolute" ou "relative".
  2. 2- Utilisez des valeurs absolues (en pixels, en points, etc.) pour un positionnement précis et des valeurs relatives (en pourcentages, en em, etc.) pour un positionnement adaptatif à différentes tailles d'écran.
  3. 3- Utilisez la propriété "width" pour définir la largeur de l'élément avant de définir sa position horizontale avec "left".
  4. 4- Utilisez la propriété "right" pour définir la position horizontale de l'élément par rapport à la bordure droite de son parent.
  5. 5- Soyez conscient que l'utilisation de la propriété "left" peut entraîner des problèmes de mise en page si l'élément dépasse les limites de son parent.

En suivant ces astuces et conseils, vous devriez être en mesure de maîtriser efficacement l'utilisation de la propriété CSS "left" pour positionner des éléments de manière précise et adaptative.



Voir aussi nos tutoriel :

XSL tutoriel

XSL tutoriel

fonction strlen

Calcule la taille d'une chaîne

Les operateurs de comparaison et logiques js

Les operateurs de comparaison et logiques javascript : Ce type d'opérateur compare ses opérandes et renvoie une valeur logique en fonction du résultat. Si la comparaison est vraie, la valeur logique retournée est true