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
Welcome! If you don't have a Git account, you can't do anything here.
You can add a comment by following this link or if you reported this bug, you can edit this bug over here.
(description)
Block user comment
Status: Assign to:
Package:
Bug Type:
Summary:
From: smokey101stair at gmail dot com
New email:
PHP Version: OS:

 

 [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-2021 The PHP Group
All rights reserved.
Last updated: Sun Sep 26 04:03:36 2021 UTC