# Using tailwind\_for\_wp\_editor.css breaks Text Formatting in WordPress Editor

**URL:** <https://forum.pinegrow.com/t/using-tailwind-for-wp-editor-css-breaks-text-formatting-in-wordpress-editor/7360>\
**Category:** Styling (CSS)\
**Tags:** css, editor, wordpress, tailwind\
**Created:** [December 10, 2022, 2:36am UTC](https://forum.pinegrow.com/t/using-tailwind-for-wp-editor-css-breaks-text-formatting-in-wordpress-editor/7360 "2022-12-10T02:36:57Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![mickythompson](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/mickythompson/32/5095_2.png) [@mickythompson](https://forum.pinegrow.com/u/mickythompson)\
**Post date:** [December 10, 2022, 2:36am UTC](https://forum.pinegrow.com/t/using-tailwind-for-wp-editor-css-breaks-text-formatting-in-wordpress-editor/7360/1 "2022-12-10T02:36:57Z")

</div>

When creating WordPress Blocks with Tailwind, we’re using tailwind\_theme/tailwind\_for\_wp\_editor.css to have those block designs reflected in the WordPress Editor (set using ‘Editor stylesheet 1’).

However, tailwind\_theme/tailwind\_for\_wp\_editor.css also removes the text formatting in WP Editor.

How do you correct tailwind\_theme/tailwind\_for\_wp\_editor.css to show the text as it would appear naturally in the WordPress editor when tailwind\_theme/tailwind\_for\_wp\_editor.css is not applied?

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/1/1a6dc5c8dbe8c0cd0fec3c9439172f69e91f3ccd.jpeg)

---

<div class="post-metadata">

**Author:** ![mickythompson](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/mickythompson/32/5095_2.png) [@mickythompson](https://forum.pinegrow.com/u/mickythompson)\
**Post date:** [December 10, 2022, 3:52pm UTC](https://forum.pinegrow.com/t/using-tailwind-for-wp-editor-css-breaks-text-formatting-in-wordpress-editor/7360/2 "2022-12-10T15:52:34Z")

</div>

Here is how the content in the WordPress Editor changes when enabling and disabling the ‘Use theme styles’ under WordPress Editor Preferences.

- Gutenberg Blocks created by Pinegrow display correctly when enabling ‘Use theme styles’.

- Gutenberg Blocks does not display correctly when disabling ‘Use theme styles’.

- Formatted Text created in WordPress does not display correctly when enabling ‘Use theme styles.’

- Formatted Text created in WordPress display correctly when enabling ‘Use theme styles’.

Is there a bug that Gutenberg Blocks and Formatted Text displays differently when using tailwind\_theme/tailwind\_for\_wp\_editor.css in the ‘Editor stylesheet 1’ setting for Pinegrow WordPress Theme Settings, or am I possibly missing a step?

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/b/b944b69858a19c95d58d3ba06fceff2edf7c1297.jpeg)

---

<div class="post-metadata">

**Author:** ![mickythompson](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/mickythompson/32/5095_2.png) [@mickythompson](https://forum.pinegrow.com/u/mickythompson)\
**Post date:** [December 10, 2022, 4:15pm UTC](https://forum.pinegrow.com/t/using-tailwind-for-wp-editor-css-breaks-text-formatting-in-wordpress-editor/7360/3 "2022-12-10T16:15:42Z")

</div>

For my Tailwind CSS Options, I am using the ‘Built-in JIT Compiler (3.2.1)’. See the screenshot below. Does anyone else have experience dealing with this issue?

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/b/ba7281ea47bf31a38c42bc4183714251bed9fec3.png)

---

<div class="post-metadata">

**Author:** ![adamslowe](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/adamslowe/32/4590_2.png) [@adamslowe](https://forum.pinegrow.com/u/adamslowe)\
**Post date:** [December 11, 2022, 7:16pm UTC](https://forum.pinegrow.com/t/using-tailwind-for-wp-editor-css-breaks-text-formatting-in-wordpress-editor/7360/4 "2022-12-11T19:16:01Z")

</div>

It looks like tailwind’s Preflight ([Preflight - Tailwind CSS](https://tailwindcss.com/docs/preflight) ) is affecting your editor styles. There are a few ways around it such as disabling preflight completely, using prose and not-prose classes, or getting crazy with your css.

I also covered this in a recent video. [Pinegrow Countdown: Day 4 – WordPress Blocks and Themes - Peak Performance Digital](https://peakperformancedigital.com/pinegrow-countdown-day-4-wordpress-blocks-and-themes/)