WordPress.org

Make WordPress Core

Opened 3 years ago

Closed 3 years ago

Last modified 3 years ago

#18011 closed defect (bug) (fixed)

Colors not shown in visual editor for already styled text

Reported by: pavelevap Owned by: iandstewart
Milestone: 3.2.1 Priority: normal
Severity: normal Version: 3.2
Component: Bundled Theme Keywords: has-patch 2nd-opinion
Focuses: Cc:

Description

Start new post

Write any word

Select this word with mouse and click "Bold"

Then select any other font color to apply it to bolded text

Now you can see that selected color is not applied in visual editor, there is only black bold text. Probably related to Twenty Eleven editor style...

Attachments (1)

18011.diff (444 bytes) - added by MattyRob 3 years ago.

Download all attachments as: .zip

Change History (12)

comment:1 MattyRob3 years ago

  • Keywords close added
  • Severity changed from normal to trivial

I am unable to reproduce this.

I can apply red and bold to text using the Visual editor in 3.2, the text appears red and bold in both the visual editor in the administration area and it also appears red and bold on the front facing pages of the site.

comment:2 pavelevap3 years ago

Tested once again in IE9 and Firefox.

After following steps above, I received in HTML editor:

<span style="color: #339966;"><strong>kjhjb</strong></span>

I tried also Firebug and I can see:

<span data-mce-style="color: #339966;" style="color: #339966;">
<strong>kjhjb</strong>
</span>

For span is applied inline color, but for strong is applied * { color: #333333; }
from editor-style.css.

comment:3 follow-up: MattyRob3 years ago

  • Component changed from Bundled Theme to TinyMCE
  • Keywords needs-patch added; close removed
  • Severity changed from trivial to normal

Ah, tried again and it seems one can apply colour and then bold successfully but not the other way around.

Confirmed in FF5, I think this is more related to TinyMCE though.

comment:4 in reply to: ↑ 3 ; follow-up: azaozz3 years ago

  • Component changed from TinyMCE to Bundled Theme
  • Keywords needs-patch removed
  • Milestone changed from Awaiting Review to 3.2.1

Replying to MattyRob:

Confirmed in FF5, I think this is more related to TinyMCE though.

No, there's no color setting for <strong> in style.css so this is a bug in editor-style.css. Not sure if the whole * {...} selector is needed as it's not present in style.css

Last edited 3 years ago by azaozz (previous) (diff)

comment:5 in reply to: ↑ 4 MattyRob3 years ago

Replying to azaozz:

No, there's no color setting for <strong> in style.css so this is a bug in editor-style.css. Not sure if the whole * {...} selector is needed as it's not present in style.css

I submit to your superior knowledge that this is the source. I can confirm this bug in 3.1 also where there is also no color parameter from <strong> in the editor-style.css file.

I've got no idea how to fix this though!

comment:6 MattyRob3 years ago

  • Summary changed from Different colors not shown in visual editor for strong text to Colors not shown in visual editor for already styled text

I thought I'd see if I could fix this by comparing italic text with bold text, however the issue is present for italic text too.

  1. Make some text italic
  2. Apply a colour

RESULT: No colour applied in visual editor.

  1. Apply a colour
  2. Make text italic

RESULT: Coloured and italic text

comment:7 MattyRob3 years ago

  • Keywords has-patch 2nd-opinion added

Hmm, after a little messing about with the CSS I think this works. Not sure if the 'color' specified _needs_ to be there as it is also defined under body.

MattyRob3 years ago

comment:8 nacin3 years ago

  • Owner set to iandstewart
  • Status changed from new to reviewing

Asking Ian to review this.

comment:9 lancewillett3 years ago

  • Cc lancewillett added

This patch looks good, the color property should not be set with the * selector.

comment:10 nacin3 years ago

  • Resolution set to fixed
  • Status changed from reviewing to closed

In [18433]:

Twenty Eleven: Don't set color in the * selector in editor styles. props MattyRob, fixes #18011 for trunk.

comment:11 nacin3 years ago

In [18434]:

Twenty Eleven: Don't set color in the * selector in editor styles. props MattyRob, fixes #18011 for 3.2.

Note: See TracTickets for help on using tickets.