[wp-trac] [WordPress Trac] #35779: TwentyFourteen float-clearing rules can break plugin output

[WordPress Trac]

#35779: TwentyFourteen float-clearing rules can break plugin output
---------------------------+-----------------------------
 Reporter:  iandunn        |      Owner:
     Type:  defect (bug)   |     Status:  new
 Priority:  normal         |  Milestone:  Awaiting Review
Component:  Bundled Theme  |    Version:  3.8
 Severity:  normal         |   Keywords:
  Focuses:                 |
---------------------------+-----------------------------
 [https://core.trac.wordpress.org/browser/trunk/src/wp-
 content/themes/twentyfourteen/style.css?rev=35802#L750 style.css:750]
 (from r25021 / #24858) uses overly broad selectors, which can
 unintentionally target elements generated by plugins.

 For example, an element like `<div class="{pluginslug}-content">` or `<p
 class="{pluginslug}-select-site">` will have empty `content` added
 before/after it, and its `display` changed to `fixed`, which could break
 the layout.

 For an observable example, visit
 [https://dayton.wordcamp.org/2016/schedule/ WordCamp Dayton 2016's
 schedule], inspect `td.wcb-session-site-maintenance`, and disable the
 following rules (which were [https://wordpress.slack.com/archives/meta-
 wordcamp/p1454786740000179  added to work around this problem]):

 {{{#!css
 .wcpt-schedule [class*="content"]:before,
 .wcpt-schedule [class*="content"]:after,
 .wcpt-schedule [class*="site"]:before,
 .wcpt-schedule [class*="site"]:after {
     content: none;
     display: inherit;
 }
 }}}

 Other Core themes use broad selectors like these, but they only target
 `align`, `wp-image`, and `attachment`, which are probably less common in
 plugin class names than `site` and `content` (although I would guess that
 they're still common enough to avoid using without a wp-specific prefix).

 Maybe explicitly targeting TwentyFourteen's classes (`site-content`,
 `content-area`, etc) would be a way to avoid this problem, while still
 maintaining backwards-compatibility?

--
Ticket URL: <https://core.trac.wordpress.org/ticket/35779>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform