jquery.app
Nederlands
EnglishDeutschFrancaisEspanol日本語Nederlands

CSS-tools

Gratis CSS Logical Properties Converter

Converteer fysieke CSS-eigenschappen naar logische voor RTL- en meertalige layouts.

Tool laden...

Wat is CSS Logical Properties Converter?

CSS-logische eigenschappen gebruiken schrijfrichting-relatieve richtingen. Inline (tekststroomrichting) en Block (loodrechte richting) vervangen Links, Rechts, Boven en Onder. Dezelfde CSS werkt voor LTR, RTL en verticale talen. margin-inline-start wordt links in LTR en rechts in RTL.

Snel antwoord

Converteer fysieke CSS-eigenschappen zoals margin-left naar schrijfrichting-bewuste logische equivalenten voor automatische RTL-ondersteuning.

Last updated: 2026-06-11

Beperkingen

  • Sommige verkorte eigenschappen hebben wisselende browsersupport.
  • Converteren van grote stylesheets vereist het controleren op randgevallen.
  • Logische eigenschappen gedragen zich anders per richting, wat tweerichtingstesten vereist.

Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub

Zo gebruik je deze tool

  1. Kies de fysieke CSS-eigenschap zoals margin-left of padding-right.
  2. Selecteer het logische equivalent.
  3. Voer de waarde in.
  4. Kopieer de declaratie en test in LTR en RTL.

Waarvoor je het kunt gebruiken

  • Bereid CSS voor meertalige websites met RTL-ondersteuning.
  • Schrijf richting-agnostische componentstijlen zonder aparte RTL-overschrijvingen.
  • Verminder de behoefte aan een apart RTL-stylesheet.

Gebruik

Praktische voorbeelden

Voorbeeld

Kaart met automatische RTL

Een kaart gebruikt margin-inline-end in plaats van margin-right. In RTL-modus draait de afstand automatisch om.

Voorbeeld

Verticale schrijfrichting

Een layout gebruikt padding-block-start in plaats van padding-top voor correcte verticale schrijfrichting.

Veelgemaakte fouten

  • Alles converteren zonder browsersupport per variant te controleren.
  • Fysieke en logische eigenschappen mengen in dezelfde declaratie.
  • Aannemen dat alle verkorte logische eigenschappen volledige support hebben.

Verificatie

  1. Schakel de richting van ltr naar rtl op het html-element om de omdraaiing te controleren.
  2. Test de pagina in LTR en RTL om afstand en uitlijning te verifiëren.

FAQ

Vragen over CSS Logical Properties Converter

Ondersteunen alle browsers logische eigenschappen?

Chrome 87+, Edge 87+, Safari 15+ en Firefox 66+ ondersteunen de kernset. Sommige verkorte varianten zijn nieuwer.

Moet ik alle fysieke eigenschappen vervangen?

Voor meertalige sites met RTL, ja. Voor alleen-Engels zijn fysieke eigenschappen nog steeds geldig.

Wat is inline versus block as?

Inline as volgt de tekststroom (horizontaal in Engels). Block as staat loodrecht (verticaal in Engels). In verticale schrijfrichting wisselen ze.

Gerelateerde tools

Meer css-tools

Css

CSS Carousel Generator

Generate native CSS carousel markup with scroll-snap, scroll buttons, scroll markers, and accessible list structure. No JavaScript required.

Open tool

Probeer ook

Probeer ook

Html

CSP Hash Generator

Genereer CSP-hashwaarden voor inline scripts en styles. Hash exacte code met SHA-256, SHA-384 of SHA-512.

Open tool