Updated: 2026-07-11
π Input CSS Code
β Converted (Logical Properties)
Conversion result will appear here...
π Property Mapping
| Physical | Logical | Description |
|---|---|---|
| margin-left | margin-inline-start | Inline start margin |
| margin-right | margin-inline-end | Inline end margin |
| margin-top | margin-block-start | Block start margin |
| margin-bottom | margin-block-end | Block end margin |
| padding-left | padding-inline-start | Inline start padding |
| padding-right | padding-inline-end | Inline end padding |
| padding-top | padding-block-start | Block start padding |
| padding-bottom | padding-block-end | Block end padding |
| border-left | border-inline-start | Inline start border |
| border-right | border-inline-end | Inline end border |
| border-top | border-block-start | Block start border |
| border-bottom | border-block-end | Block end border |
| left | inset-inline-start | Inline start offset |
| right | inset-inline-end | Inline end offset |
| top | inset-block-start | Block start offset |
| bottom | inset-block-end | Block end offset |
| width | inline-size | Inline dimension |
| height | block-size | Block dimension |
| text-align: left | text-align: start | Start alignment |
| text-align: right | text-align: end | End alignment |
| float: left | float: inline-start | Inline start float |
| float: right | float: inline-end | Inline end float |
π‘ Guide
- Logical properties: Direction-independent CSS that adapts to LTR/RTL automatically
- RTL support: Arabic, Hebrew and other RTL languages adapt automatically
- i18n best practice: Logical properties are recommended for internationalized web apps
- Comments, formatting, and unmatched properties are preserved
- Everything runs locally: Physical CSS Propert and other values are processed on your device, never sent to a server