Question

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.

Answer 1

Probably <wbr> is what you re looking for.

Answer 2

<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: "0200B" }

友情链接