<span> does not work well with <strong>

[Bertil Friman]

Dear sir or ms
In my free time, I help an association with their home page.
They noticed that it was not possible to mark a text with a colour
after some tests and investigation, I found that the reason was
a conflict between the <strong> and the <span> tags, which is documented here:
​http://themefuse.com/forum/justmarried-wp/html-span-color-strong-color-does-not-show
The wordpress visual editor uses <span> for color and <strong> for bold face. To repeat the error,

1. Create a post
2. Write a few lines
3. Select a word.
4. Click the B button (for bold face). The word is not showed as bold.
5. Select the word again
6. Now clock the triangle at the right of the underscored A button
7. Select a color, for example sea green.
8. Deselect the word, it is now showed bold and sea green.
9. Update the page.
10. In another tab, visit the page and the post.
11. The word is shown bold but black (no color)

I found a slight resemblance with a four year old ticket:
#13234. It was closed without action, and a work around
was proposed, meaning that color (<span>) should be used first
and the other style tag after.
This is also what I told the chairwoman in the association to do:
First set the color, then make it bold.

HTML code (example):
Works not: <span style="color: #339966;"><strong>fiskdamm</strong></span>

Works: <strong><span style="color: #339966;">försäljning</span></strong>

If however <b> is used instead of <strong>, then there appears not to be any conflict. For example, the following html code is both shown bold and colored (in firefox):
<span style="color: #339966;"><b>Varmt välkomna önskar styrelsen i Fastighetsägareföreningen</b></span>

All these examples come from the (swedish) page evlinge.hemsida.eu. You may visit it if you like, but it will be moved soon, to another domain name.

Note the the visual editor shows both color and bold regardless of in which order these are used.

Could it be a solution to use the <b> tag instead of <strong>?

Best regards
Bertil Friman
Stockholm

[Bertil Friman]

Look for "color:" to find the mentioned examples.

[Bertil Friman]

There was a misspelling in the instructions how to repeat the bug, item 4:
The word is noW showed as bold (was misspelled as The word is not showed as bold).

[knutsp]

Thank you for the report.

There are, however, no conflicts between html elements in this case. The problem is, I think, that your theme styles the <strong> element's color inside ​http://www.evlinge.hemsida.eu/wp-content/themes/SimplePress/style.css:

strong { font-weight: bold; color: #1c1c1c; }

I suggest contacting your theme vendor to fix this, or just fix it yourself by removing color: #1c1c1c; from that line, or later in the sylesheet cascade, like in a child theme, define this color to be inherited. You may seek more help on this in our support forums ​http://wordpress.org/support/.

[iseulde]

This is indeed a theme issue.