[Vuejs]-Tip tap does not show bold or italic text when the color is also set

by

0👍

The issue you’re experiencing seems related to CSS specificity rules, where the color attribute (set as inline styles) is overriding the bold and italic styles.

You can try resolving it by adding CSS rules to make the bold and italic styles more specific:

.editor-content span[style*="color"] strong {
    font-weight: bold !important;
}

.editor-content span[style*="color"] em {
    font-style: italic !important;
}

If this doesn’t work, consider creating a custom Tiptap extension combining TextStyle and Color features.

Hope this helps!

Leave a comment