diff --git a/developer_manual/html_css_design/css.rst b/developer_manual/html_css_design/css.rst index 443a324c8e7..07a272e4c30 100644 --- a/developer_manual/html_css_design/css.rst +++ b/developer_manual/html_css_design/css.rst @@ -263,3 +263,46 @@ There are some predefined classes for public use to ease developing an applicati +----------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+ | ``.inlineblock`` | Make an element an inline block | +----------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+ + +RTL guidelines +============== + +Dos and Don'ts +^^^^^^^^^^^^^^ + +.. list-table:: + :header-rows: 1 + + * - Bad + - Good + - Description + * - Use physical properties ``margin-left`` + - Use logical properties ``margin-inline-start`` + - Using logical propreties automatically adapts to LTR/RTL + * - Use ``left`` or ``right`` + - Use inset-inline-start/end + - Keep positiong directon aware + * - Use text-align: left/right + - Use text-align: start/end + - Text aligns correctly in both modes + * - Use border-left/right + - Use border-inline-start/end + - Borders flip correctly + * - Use float: left/right + - Use float: inline-start/end + - Float respects direction + * - Assume RTL “just works” + - Test your app with RTL languages + - Using the correct css value is not always enough to avoid bugs + + + + + + + + + + + + \ No newline at end of file