php.net |  support |  documentation |  report a bug |  advanced search |  search howto |  statistics |  random bug |  login
Bug #76689 Manual page display problems due to text wrapping changes in Firefox
Submitted: 2018-08-01 01:26 UTC Modified: 2018-08-01 19:01 UTC
From: smokey101stair at gmail dot com Assigned:
Status: Open Package: Website problem
PHP Version: Irrelevant OS:
Private report: No CVE-ID: None
View Add Comment Developer Edit
Anyone can comment on a bug. Have a simpler test case? Does it work for you on a different platform? Let us know!
Just going to say 'Me too!'? Don't clutter the database with that please — but make sure to vote on the bug!
Your email address:
MUST BE VALID
Solve the problem:
30 + 8 = ?
Subscribe to this entry?

 
 [2018-08-01 01:26 UTC] smokey101stair at gmail dot com
Description:
------------
I first reported this change at [1]. This is the result of a change from [2], which changes how the CSS properties overflow-wrap and word-wrap work. You can see the difference in the image[4]. [3] is currently a discussion about whether this change should be reverted or not, so its probably a good idea to follow along and review any usage of overflow-wrap and word-wrap on the PHP website.

[1] https://bugzilla.mozilla.org/show_bug.cgi?id=1479302
[2] https://bugzilla.mozilla.org/show_bug.cgi?id=1472386
[3] https://github.com/w3c/csswg-drafts/issues/2951
[4] https://user-images.githubusercontent.com/24432753/43457627-c0444704-94c7-11e8-980a-13d1b7a232f5.png


Patches

Add a Patch

Pull Requests

Add a Pull Request

History

AllCommentsChangesGit/SVN commitsRelated reports
 [2018-08-01 01:34 UTC] daverandom@php.net
-Summary: Table rendering with long words has changed in Firefox +Summary: Manual page display problems due to table layout handling changes in Firefox
 [2018-08-01 01:36 UTC] daverandom@php.net
-Summary: Manual page display problems due to table layout handling changes in Firefox +Summary: Manual page display problems due to text wrapping changes in Firefox
 [2018-08-01 02:28 UTC] levim@php.net
Can you test what `table-layout: fixed` looks like on this Firefox alpha? It has other issues; I would definitely prefer an auto layout so the description column gets more space, but if its auto layout determines to put 3 characters per line... maybe it is the best we can do.
 [2018-08-01 12:01 UTC] cmb@php.net
In my opinion, even the old behavior is a bug (see bug #66726).
In this case, it's probably a good idea to remove the description
column from the table, and to lay out the information like the ini
directive docs (e.g.
<http://php.net/manual/en/filesystem.configuration.php>).
 [2018-08-01 13:37 UTC] smokey101stair at gmail dot com
Here is what the table looks like when applying table-layout: fixed in Firefox 63 alpha https://imgur.com/a/7YIQBXl
 [2018-08-01 19:01 UTC] smokey101stair at gmail dot com
Sorry, I forgot to apply table-layout: fixed to the Changelog table in the image in my previous comment. When appling table-layout: fixed on that table, it gets split 50/50 between the two columns.

Here is an updated image: https://imgur.com/64a3CwV
 [2021-09-03 01:05 UTC] ddpm at liscovius dot de
Alternative approaches to mitigate this a bit:

1. Using CSS word wrapping/breaking rules (prefered by me):

.doctable td {
  word-break:break-word; /* or even 'break-all' */
  /* also word-wrap: as behavior differs a bit between browsers. */
}

.doctable td:nth-child(1) {
  word-break:keep-all; /* to avoid breaking keywords mostly in firt column */
}

If the cells would have some class this would even be better because then can be defined by CSS which cells content can be wrapped on narrow displays and which better not.


2. Using grid layout CSS rules for arranging the cells of a doctable row into a grid:

Another approach would be to use alternate rendering of the table columns using e.g. css grid layout templates for the table rows for small displays. (probably too complex for now as number and type of columns differs through the documentation an topics, maybe first set consistent css class attributes for the td first)

example css transformation  of a tr row by grid layout

https://www.php.net/manual/en/filter.filters.validate.php
 
-------------------------------
| id | name | options | flags |
-------------------------------
|         description         |
-------------------------------
 
PHP Copyright © 2001-2024 The PHP Group
All rights reserved.
Last updated: Tue Mar 19 10:01:30 2024 UTC