# Hyphenate/justify posts

**URL:** <https://discuss.write.as/t/hyphenate-justify-posts/890>\
**Category:** Customization\
**Tags:** writeas, writefreely\
**Created:** [October 27, 2019, 2:15pm UTC](https://discuss.write.as/t/hyphenate-justify-posts/890 "2019-10-27T14:15:25Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![vvug](https://discuss.write.as/user_avatar/discuss.write.as/vvug/32/382_2.png) [@vvug](https://discuss.write.as/u/vvug)\
**Post date:** [October 27, 2019, 2:15pm UTC](https://discuss.write.as/t/hyphenate-justify-posts/890/1 "2019-10-27T14:15:25Z")

</div>

Hi WriteFreely community! How I can hyphenate (justify) my WriteFreely posts? Browsers now support hyphenation natively. Is there a CSS repice? Thanks!

---

<div class="post-metadata">

**Author:** ![cjeller1592](https://discuss.write.as/user_avatar/discuss.write.as/cjeller1592/32/128_2.png) [@cjeller1592](https://discuss.write.as/u/cjeller1592)\
**Post date:** [October 28, 2019, 3:09pm UTC](https://discuss.write.as/t/hyphenate-justify-posts/890/2 "2019-10-28T15:09:24Z")

</div>

Hi @vvug! You can justify your WriteFreely posts through a CSS recipe. All you need to do is go into the Custom CSS of your WriteFreely blog and add the following:

```auto
#post-body {
    text-align: justify;
}

```

This will hyphenate (justify) your posts. Hope that helps and let us know if it works.

---

<div class="post-metadata">

**Author:** ![vvug](https://discuss.write.as/user_avatar/discuss.write.as/vvug/32/382_2.png) [@vvug](https://discuss.write.as/u/vvug)\
**Post date:** [October 28, 2019, 3:34pm UTC](https://discuss.write.as/t/hyphenate-justify-posts/890/3 "2019-10-28T15:34:31Z")

</div>

Thanks! It almost works. It works in Chrome when viewing a single post, but it doesn’t work in the blog’s homepage, and it doesn’t work in Firefox at all.

---

<div class="post-metadata">

**Author:** ![cjeller1592](https://discuss.write.as/user_avatar/discuss.write.as/cjeller1592/32/128_2.png) [@cjeller1592](https://discuss.write.as/u/cjeller1592)\
**Post date:** [October 28, 2019, 5:26pm UTC](https://discuss.write.as/t/hyphenate-justify-posts/890/4 "2019-10-28T17:26:32Z")

</div>

No worries! This will do the trick for the homepage and post view:

```auto
.book.e-content,.book.p-summary, #post-body {
    text-align:justify;
}

```

Firefox is what’s getting me though. It doesn’t work at all like you said. This might have to do with `white-space` or something similar. Maybe someone knows about this problem who could help?

---

<div class="post-metadata">

**Author:** ![matt](https://discuss.write.as/user_avatar/discuss.write.as/matt/32/2760_2.png) [@matt](https://discuss.write.as/u/matt)\
**Post date:** [May 29, 2020, 10:20am UTC](https://discuss.write.as/t/hyphenate-justify-posts/890/5 "2020-05-29T10:20:05Z")

</div>

As mentioned in [WriteFreely issue #308](https://github.com/writeas/writefreely/issues/308#issuecomment-635894506), an additional CSS rule is needed for Firefox and Safari. Full comment copied here:

* * *

After finding [this issue](https://github.com/facebook/draft-js/issues/1012), it looks like the way to fix this in Firefox (and possibly Safari) is to include this rule:

```css
white-space: normal;

```

**Important!** this removes the ability to insert single linebreaks in your posts.

* * *

Here’s a starter stylesheet you can use to justify text, with this fix included. It may not be comprehensive, but it adjusts for special elements like lists:

```css
body#post article *, body#collection article * {
    text-align: justify;
    white-space: normal !important;
}
body#post article ol, body#post article ul, body#collection article ol, body#collection article ul {
    margin: 2rem 0 2rem;
}
body#post article li, body#collection article li {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

```

And we do plan to improve the default stylesheets in Write.as / WriteFreely to make these kinds of customizations easier in the future.