> For the complete documentation index, see [llms.txt](https://rosea.gitbook.io/baztheme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://rosea.gitbook.io/baztheme/getting-started/rtl-layout.md).

# RTL Layout

<figure><img src="/files/KLVa0mqtMHZHspuQROsk" alt=""><figcaption></figcaption></figure>

### Hide Element Based on Text Direction

To hide an element based on the text direction (RTL or LTR), you can use CSS or JavaScript:

#### **Using CSS:**

```css
[dir="rtl"] .element-to-hide {
    display: none;
}

[dir="ltr"] .element-to-hide {
    display: none;
}
```

#### **Hide element in content using CSS classes (HTML)**

To hide an element in your HTML content using CSS, you can apply specific CSS classes. Here’s a straightforward approach:

{% code overflow="wrap" lineNumbers="true" %}

```html
<p class="dir-ltr-hide">This paragraph is hidden on LTR, standard layout.</p>
<p class="dir-rtl-hide">This paragraph is hidden on RTL, right to left layout.</p>
```

{% endcode %}
