Make WordPress Core

Opened 8 years ago

Closed 5 years ago

#38999 closed defect (bug) (wontfix)

Border broken if enabled in tinymce preview_styles

Reported by: smerriman's profile smerriman Owned by:
Milestone: Priority: normal
Severity: normal Version:
Component: TinyMCE Keywords:
Focuses: Cc:


This affects any theme, but as a simple way to replicate in a fresh installation of WordPress / twentyfifteen:

1) In functions.php, add:

function twentyfifteen_tinymce_before_init( $init ) {
    return $init;
add_filter('tiny_mce_before_init', 'twentyfifteen_tinymce_before_init');

This resets back to TinyMCE's default preview styles, which includes border (WordPress' default excludes this for some reason).

2) In css/editor-style, add a border to h2:

h2 {border-bottom:1px solid #000;}

3) If you now load the visual editor, click toolbar toggle, and look at the h2 in the block formats dropdown, you do not see a border. If you look at the dropdown element in inspector, you will see broken CSS for border, border-radius, and outline:

style='font-family:"Noto Serif",serif;font-size:29px;font-weight:700;font-style:normal;text-decoration:none;text-transform:none;color:rgb(51, 51, 51);border:;border-radius:;outline:;text-shadow:none;

Is this a bug in TinyMCE, or a compatibility bug with WordPress code somewhere? Given border is part of the default preview styles and WordPress removed it, I'm guessing a bug in WordPress somewhere.

Change History (1)

#1 @azaozz
5 years ago

  • Milestone Awaiting Review deleted
  • Resolution set to wontfix
  • Status changed from new to closed

The preview_styles setting for TinyMCE was added in the WP implementation exactly for that reason: it doesn't work well in many cases, and on the (old) Edit Post screen.

Closing as wontfix, feel free to reopen with a patch if this still needs fixing in the classic editor.

Note: See TracTickets for help on using tickets.