Skip to content
This repository was archived by the owner on Oct 17, 2025. It is now read-only.

Conversation

@CShepartd
Copy link
Contributor

Reverts #1284

Nesting overflow-wrap: anywhere in flex element is unproperly. For better understand this rule see this example

@wbamberg wbamberg requested a review from estelle February 5, 2019 18:56
@wbamberg
Copy link
Contributor

wbamberg commented Feb 5, 2019

@estelle , would you mind looking at this?

@estelle
Copy link
Member

estelle commented Feb 5, 2019

LGTM.

@wbamberg
Copy link
Contributor

wbamberg commented Feb 5, 2019

Sorry @estelle , I should have been clearer. This PR reverts the example which we added in #1284, on the grounds that overflow-wrap: anywhere should not be used with flex.

The first iteration of that PR didn't show the difference between anywhere and break-word, so I suggested using flex, although I got the idea from the other example in the page: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap#Example.

I'm not familiar enough with this property to know whether it's true that overflow-wrap: anywhere should not be used with flex, but I've got no reason to doubt @CShepartd .

So I think just merging this PR is not enough: if we do want an example for overflow-wrap: anywhere, then we should add one that does not use flex, but that still illustrates the difference between anywhere and the other values. We should also presumably fix the example in the page, that also uses flex.

Can you take this on, since you originally updated the page to add anywhere?

@estelle
Copy link
Member

estelle commented Feb 5, 2019

I thought you just wanted to revert the example at the top. As it also doesn't yet work in all browsers and you can't really tell the difference, i am fine with reverting it. The examples do need to be redone, as overflow-wrap/word-wrap property only works on inline boxes, and the examples through out the page are on block level elements.

@wbamberg
Copy link
Contributor

wbamberg commented Feb 7, 2019

@schalkneethling , this PR is showing a snyk failure, although I don't see anything in the actual change to reflect that. What do you think?

@schalkneethling
Copy link

@schalkneethling , this PR is showing a snyk failure, although I don't see anything in the actual change to reflect that. What do you think?

It is one of our dependencies that needs to be updated. Not introduced here. This is fine to merge.

@schalkneethling
Copy link

schalkneethling commented Feb 8, 2019

@wbamberg Probably a good idea to rebase this against master as I have updated a couple of the dependencies.

…low-wrap

* upstream/master:
  chore(deps): update dependency all-contributors-cli to v6 (mdn#1313)
  chore(deps): update dependency prettier to v1.16.4 (mdn#1304)
  chore(deps): update dependency ajv to v6.8.1 (mdn#1306)
  chore(deps): update dependency eslint to v5.13.0 (mdn#1305)
  chore(deps): update dependency all-contributors-cli to v5.11.0 (mdn#1302)
  highlight gotchas of array sort (mdn#1308)
  Small Update Join Docs -- Add quotes to show output as a string (mdn#1307)
  Add more Intl.RelativeTimeFormat examples (mdn#1300)
  Add example for globalThis (mdn#1299)
  Add travisbuddy to Travis config (mdn#1301)
  chore(deps): update dependency prettier to v1.16.1 (mdn#1297)
  chore(deps): update dependency mdn-bob to v1.1.23 (mdn#1296)
  chore(deps): update dependency stylelint to v9.10.1 (mdn#1291)
  chore(deps): update dependency eslint to v5.12.1 (mdn#1295)
  chore(deps): update dependency all-contributors-cli to v5.10.2 (mdn#1288)
  [Snyk] Fix for 1 vulnerable dependencies (mdn#1294)
  text-transform: full-size-kana value (mdn#1289)
  renamed function findFirstLargeNumber to isLargeNumber (mdn#1293)
Copy link
Contributor

@wbamberg wbamberg left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @CShepartd ! I rebased this PR and the snyk error seems to have gone away.

@wbamberg wbamberg merged commit 32d64d5 into mdn:master Feb 8, 2019
wbamberg pushed a commit to dehuszar/interactive-examples that referenced this pull request Feb 22, 2019
* upstream/master: (36 commits)
  Add example of string replace without regex (mdn#1321)
  Revert "added anywhere value to overflow-wrap property" (mdn#1311)
  chore(deps): update dependency all-contributors-cli to v6 (mdn#1313)
  chore(deps): update dependency prettier to v1.16.4 (mdn#1304)
  chore(deps): update dependency ajv to v6.8.1 (mdn#1306)
  chore(deps): update dependency eslint to v5.13.0 (mdn#1305)
  chore(deps): update dependency all-contributors-cli to v5.11.0 (mdn#1302)
  highlight gotchas of array sort (mdn#1308)
  Small Update Join Docs -- Add quotes to show output as a string (mdn#1307)
  Add more Intl.RelativeTimeFormat examples (mdn#1300)
  Add example for globalThis (mdn#1299)
  Add travisbuddy to Travis config (mdn#1301)
  chore(deps): update dependency prettier to v1.16.1 (mdn#1297)
  chore(deps): update dependency mdn-bob to v1.1.23 (mdn#1296)
  chore(deps): update dependency stylelint to v9.10.1 (mdn#1291)
  chore(deps): update dependency eslint to v5.12.1 (mdn#1295)
  chore(deps): update dependency all-contributors-cli to v5.10.2 (mdn#1288)
  [Snyk] Fix for 1 vulnerable dependencies (mdn#1294)
  text-transform: full-size-kana value (mdn#1289)
  renamed function findFirstLargeNumber to isLargeNumber (mdn#1293)
  ...
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants