Ejemplo
Ajuste el borde izquierdo de la absoluta posicionado <div> 80px elemento a la derecha del borde izquierdo de su antepasado posicionado más próximo:
div.absolute {
position: absolute;
left: 80px;
width: 200px;
height: 120px;
border: 3px solid #8AC007;
}
Inténtalo tú mismo " Definición y Uso
Para los elementos con posición absoluta, la propiedad left establece el borde izquierdo de un elemento a una unidad hacia la izquierda / derecha del borde izquierdo de su antepasado posicionado más próximo.
Nota: Si un elemento con posición absoluta no tiene antepasados posicionado, que utiliza el cuerpo del documento, y se mueve junto con el desplazamiento de página.
Nota: Un "positioned" elemento es uno cuya posición es nada más que estática.
Para los elementos en posición relativa, la propiedad left establece el borde izquierdo de un elemento a una unidad hacia la izquierda / derecha a su posición normal.
Note: Si "position:static" , la propiedad dada no tiene ningún efecto.
| Valor por defecto: | auto |
|---|---|
| Heredado: | no |
| animatable: | yes. Read about animatable Try it |
| Versión: | CSS2 |
| la sintaxis de JavaScript: | object .style.left="100px" Try it |
Soporte para el navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
| Propiedad | |||||
|---|---|---|---|---|---|
| left | 1.0 | 5.5 | 1.0 | 1.0 | 5.0 |
sintaxis CSS
left: auto|length|initial|inherit;Valores de propiedad
| Valor | Descripción | Juegalo |
|---|---|---|
| auto | Permite que el navegador calcular la posición del borde izquierdo. Esto es por defecto | Juegalo " |
| length | Establece la posición del borde izquierdo en píxeles, cm, etc. Los valores negativos se les permite | Juegalo " |
| % | Establece la posición del borde izquierdo en% de contener elemento. Los valores negativos se les permite | Juegalo " |
| initial | Establece esta propiedad a su valor por defecto. Lea acerca inicial | Juegalo " |
| inherit | Hereda esta propiedad de su elemento padre. Lee sobre heredar |
Páginas relacionadas
CSS tutorial: Posicionamiento CSS
Referencia CSS: right property
Referencia CSS: bottom property
Referencia CSS: top property
Referencia HTML DOM: left property