Steps to replicate the issue (include links if applicable):
- Open https://m.wikidata.org/wiki/Q746157?uselang=he in a private window*
What happens?:
Statement values are left-aligned even though the interface is in a rtl language.
What should have happened instead?:
Statement values should be right-aligned when the interface is in a rtl language.
Software version (skip for WMF-hosted wikis like Wikipedia):
Other information (browser name/version, screenshots, etc.):
.wikibase-statementview-mainsnak and .wikibase-snakview-value-container both have dir="auto" and the mobile site has extra CSS which causes .wikibase-snakview-value-container to be displayed as an inline element.
The dir attribute isolates the element, i.e. the direction inside the element won't affect anything outside the element, and the direction of anything outside the element won't affect anything inside the element (https://www.w3.org/International/articles/inline-bidi-markup/index.en.html describes how it works).
What seems to be happening:
Setting dir="auto" on .wikibase-snakview-value-container means its content does not affect the direction of its container.
Setting display: inline causes it to only be as wide as its content and positioned in the parent element according to the parent element's direction.
Setting dir="auto" on .wikibase-statementview-mainsnak means its direction is based only on its content.
Its content is directionally isolated.
It can't determine a direction from the parent elements or the child elements, and defaults to ltr.
Task Time May 26:
A/C
- RTL alignment is right aligned on wbui2025
-
