[wp-trac] [WordPress Trac] #31250: Twenty Fifteen editor styles look weird on mobile

[WordPress Trac]

#31250: Twenty Fifteen editor styles look weird on mobile
------------------------------------------------+--------------------------
 Reporter:  iseulde                             |       Owner:
     Type:  defect (bug)                        |      Status:  new
 Priority:  normal                              |   Milestone:  Future
Component:  Bundled Theme                       |  Release
 Severity:  normal                              |     Version:  4.1
 Keywords:  has-patch ui-feedback dev-feedback  |  Resolution:
                                                |     Focuses:
------------------------------------------------+--------------------------

Comment (by jacklenox):

 So the biggest problem here appears to be the content overflowing the
 width of the editor on mobile. The styling of lists is more subjective,
 but the width issue really does make the editor unusable.

 The cause of this appears to be the fixed widths that are applied to the
 images and the HTML5 `<dl>` elements. This isn't just a problem with
 Twenty Fifteen, it's a potential problem for any theme, especially if it
 has HTML5 captions.

 My patch above fixes two things. Below `660px` it sets any width that has
 a `max-width` of `660px` to `100%`. This is arguably specific to Twenty
 Fifteen.

 The second part is to force image and caption widths to be `auto`. This
 looks good to me because any image that is below the width of the viewport
 still looks as it should, and any image that is above the width is forced
 to fit in.

 What do you folks thing of this approach? And given that the fixed widths
 on images and captions aren't necessarily incorrect, should we apply a
 variation of this to the editor for all themes?

--
Ticket URL: <https://core.trac.wordpress.org/ticket/31250#comment:13>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform