Propiedades y Valores Lógicos de CSS
====================================

**CSS Logical Properties** (las propiedades lógicas en CSS) son un módulo de CSS que introduce propiedades y valores lógicos, proporcionando la capacidad de controlar el diseño de forma lógica en vez de la asignación de dimensiones físicas de dirección y dimensión.

Este módulo también define propiedades y valores lógicos para propiedades previamente definidas en CSS 2.1. Las propiedades lógicas definen una equivalencia a sus propiedades físicas correspondientes.

### Dimensiones de bloque y en línea

Las propiedades y valores lógicos usan los términos abstractos de bloque (*block)* y en línea (*inline)* para describir la dirección en la que fluyen. El sentido físico de estos términos depende del modo de escritura.

Dimensión de bloque

Es la dimensión perpendicular al flujo del texto en línea, es decir, la dimensión vertical en un modo de escritura horizontal, y la dimensión horizontal en un modo de escritura vertical. Para el texto estándar en inglés, es la dimensión vertical.

Dimensión en línea

Es la dimensión paralela al flujo del texto en línea, es decir, la dimensión horizontal en un modo de escritura horizontal, y la dimensión vertical en un modo de escritura vertical. Para el texto estándar en inglés, es la dimensión horizontal.

Referencia
----------

### Propiedades para dimensionamiento

* `block-size` 
Experimental
* `inline-size` 
Experimental
* `max-block-size` 
Experimental
* `max-inline-size` 
Experimental
* `min-block-size` 
Experimental
* `min-inline-size` 
Experimental
### Propiedades para márgenes, bordes y relleno

* `border-block` 
Experimental
* `border-block-color` 
Experimental
* `border-block-end` 
Experimental
* `border-block-end-color` 
Experimental
* `border-block-end-style` 
Experimental
* `border-block-end-width` 
Experimental
* `border-block-start` 
Experimental
* `border-block-start-color` 
Experimental
* `border-block-start-style` 
Experimental
* `border-block-start-width` 
Experimental
* `border-block-style` 
Experimental
* `border-block-width` 
Experimental
* `border-color` (`logical` 
Experimental
 palabra clave)
* `border-inline` 
Experimental
* `border-inline-color` 
Experimental
* `border-inline-end` 
Experimental
* `border-inline-end-color` 
Experimental
* `border-inline-end-style` 
Experimental
* `border-inline-end-width` 
Experimental
* `border-inline-start` 
Experimental
* `border-inline-start-color` 
Experimental
* `border-inline-start-style` 
Experimental
* `border-inline-start-width` 
Experimental
* `border-inline-style` 
Experimental
* `border-inline-width` 
Experimental
* `border-start-start-radius` 
Experimental
* `border-start-end-radius` 
Experimental
* `border-end-start-radius` 
Experimental
* `border-end-end-radius` 
Experimental
* `border-style` (`logical` 
Experimental
 palabra clave)
* `border-width` (`logical` 
Experimental
 palabra clave)
* `margin` (`logical` 
Experimental
 palabra clave)
* `margin-block` 
Experimental
* `margin-block-end` (en-US) 
Experimental
* `margin-block-start` 
Experimental
* `margin-inline` 
Experimental
* `margin-inline-end` 
Experimental
* `margin-inline-start` 
Experimental
* `padding` (`logical` 
Experimental
 palabra clave)
* `padding-block` 
Experimental
* `padding-block-end` 
Experimental
* `padding-block-start` 
Experimental
* `padding-inline` 
Experimental
* `padding-inline-end` 
Experimental
* `padding-inline-start` 
Experimental
### Propiedades para flotantes y posicionamiento

* `clear` (`inline-end` 
Experimental
 y `inline-start` 
Experimental
 palabras claves)
* `float` (`inline-end` 
Experimental
 y `inline-start` 
Experimental
 palabras claves)
* `inset` 
Experimental
* `inset-block` 
Experimental
* `inset-block-end` 
Experimental
* `inset-block-start` 
Experimental
* `inset-inline` 
Experimental
* `inset-inline-end` 
Experimental
* `inset-inline-start` 
Experimental
### Otras propiedades

* `caption-side` (en-US) (`inline-end` 
Experimental
 y `inline-start` 
Experimental
 palabras claves)
* `resize` 
Experimental
 (`block` 
Experimental
 y `inline` 
Experimental
 palabras claves)
* `text-align` (`end` 
Experimental
 y `start` 
Experimental
 palabras claves)
### Propiedades obsoletas

* `offset-block-end` (en-US) 
Non-standard

Obsoleto
 (ahora `inset-block-end` 
Experimental
)
* `offset-block-start` (en-US) 
Non-standard

Obsoleto
 (ahora `inset-block-start` 
Experimental
)
* `offset-inline-end` (en-US) 
Non-standard

Obsoleto
 (ahora `inset-inline-end` 
Experimental
)
* `offset-inline-start` (en-US) 
Non-standard

Obsoleto
 (ahora `inset-inline-start` 
Experimental
)
Guías
-----

* Conceptos básicos de propiedades y valores lógicos
* Propiedades Lógicas para dimensionamiento
* Propiedades Lógicas para márgenes, bordes y relleno
* Propiedades Lógicas para flotantes y posicionamiento
Especificaciones
----------------

| Specification |
| --- |
| CSS Logical Properties and Values Level 1  |

Compatibilidad en los Navegadores
---------------------------------

En general:

* Firefox tiene soporte para las propiedades asignadas — donde hay una directa asignación desde la versión física a la versión lógica.
* Chrome, desde la versión 69, tiene soporte para las propiedades asignadas.
* Edge actualmente no tiene soporte.
* Firefox 66 introduce soporte para dos valores abreviados.

Mira la página de la propiedad en específico para tener una información más completa sobre su compatibilidad.