# Writing mode

**URL:** <https://discourse.mozilla.org/t/writing-mode/111336>\
**Category:** Learn\
**Created:** [February 20, 2023, 6:22am UTC](https://discourse.mozilla.org/t/writing-mode/111336 "2023-02-20T06:22:30Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![fenosoaliva\_ratovoson](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/fenosoaliva_ratovoson/32/61087_2.png) [@fenosoaliva\_ratovoson](https://discourse.mozilla.org/u/fenosoaliva_ratovoson)\
**Post date:** [February 20, 2023, 6:22am UTC](https://discourse.mozilla.org/t/writing-mode/111336/1 "2023-02-20T06:22:30Z")

</div>

coucou @mikoMK! je n’ai pas réussi cette tâche

> <https://github.com/Fenosoaliva/Fenosoa.github.io/blob/main/writingmode/tache3.css>

  

> <https://github.com/Fenosoaliva/Fenosoa.github.io/blob/main/writingmode/tache3.css>

  
merci

---

<div class="post-metadata">

**Author:** ![mikoMK](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/mikomk/32/50456_2.png) [@mikoMK](https://discourse.mozilla.org/u/mikoMK)\
**Post date:** [February 26, 2023, 4:00pm UTC](https://discourse.mozilla.org/t/writing-mode/111336/2 "2023-02-26T16:00:04Z")

</div>

Hi @fenosoaliva_ratovoson

Congratulation! You set all props correctly!

On a general note: It would have been better to **replace** the props in the `.box` instead of **adding** them to `.vertical`. `.vertical` should only include `writing-mode: vertical-rl;`. The logical props in `.box` would then behave correctly for different writing modes.

Does that make sense?

Michael

---

<div class="post-metadata">

**Author:** ![fenosoaliva\_ratovoson](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/fenosoaliva_ratovoson/32/61087_2.png) [@fenosoaliva\_ratovoson](https://discourse.mozilla.org/u/fenosoaliva_ratovoson)\
**Post date:** [February 27, 2023, 5:33am UTC](https://discourse.mozilla.org/t/writing-mode/111336/3 "2023-02-27T05:33:02Z")

</div>

bonjour @mikoMK! pourtant quand je charge la page le mien ne ressemble pas à celui dans l’exemple de MDN 😅

---

<div class="post-metadata">

**Author:** ![mikoMK](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/mikomk/32/50456_2.png) [@mikoMK](https://discourse.mozilla.org/u/mikoMK)\
**Post date:** [February 28, 2023, 3:00am UTC](https://discourse.mozilla.org/t/writing-mode/111336/4 "2023-02-28T03:00:51Z")

</div>

Yeah exactly. 😁  
Your vertical box has, for example, the correct `padding-block-start:40px;` but **also** `padding-top: 40px;` from the `.box` that doesn’t react to the writing mode. The correct borders get also overwritten by the “wrong” borders of `.box`.

---

<div class="post-metadata">

**Author:** ![fenosoaliva\_ratovoson](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/fenosoaliva_ratovoson/32/61087_2.png) [@fenosoaliva\_ratovoson](https://discourse.mozilla.org/u/fenosoaliva_ratovoson)\
**Post date:** [March 1, 2023, 5:03am UTC](https://discourse.mozilla.org/t/writing-mode/111336/5 "2023-03-01T05:03:27Z")

</div>

bonjour @mikoMK! 😁 😁 😁 😁 ahh ok merci