3

I'm showing up veeeery long URLs in my Safari extension. Obviously, they can't fit on a single line. Currently, word breaking rules make it so most URLs are on two lines: the first one is rather short and ends with the ? symbol, and the other is ridiculously long and contains all the rest of the GET parameters.

I'd like to make it so words also break on the & symbol, without screwing up copy-paste if possible. I've tried to replace every & with &\u00ad (& + the soft hyphen character), but it's kind of weird to see the hyphen after the & when there really isn't any in the URL.

I thought there was something in store with CSS3 for that kind of problem, but I can't find it.

Any suggestion welcome, as long as it works with Safari.

zneak
  • 134,922
  • 42
  • 253
  • 328

2 Answers2

5

Probably <wbr> is what you're looking for.

Crozin
  • 43,890
  • 13
  • 88
  • 135
1

<wbr> is a good answer, but you might also consider the zero-width space entity. I haven't used it much, but this article suggests using the following css to extend the cross-browser functionality:

wbr:after { content: "\00200B" }
theazureshadow
  • 9,499
  • 5
  • 33
  • 48