citation-style-language / csl-editor

cslEditorLib - A HTML 5 library for searching and editing CSL styles
http://editor.citationstyles.org
MIT License
187 stars 34 forks source link

Wrap URLs #201

Open rmzelle opened 7 years ago

rmzelle commented 7 years ago

Currently, long URLs in item metadata don't wrap, creating a horizontal scrollbar in the fixed-width left panel. Apart from making the panel wider, it looks like we could also wrap the URLs with word-wrap:break-word; (per http://stackoverflow.com/a/7309193/1712389).

image

rmzelle commented 7 years ago

Digging into this a bit more: apparently Firefox and Chrome wrap URLs different. Chrome doesn't do any wrapping by default, while Firefox wraps at slashes (see https://github.com/mozilla/chronicle/issues/238). The latter still gives problems for the Campbell & Pedersen example on my 13" laptop screen because in this particular case the proxy makes the subdomain + domain part very long ("cps.sagepub.com.turing.library.northwestern.edu"). So it would already help to just change http://cps.sagepub.com.turing.library.northwestern.edu/content/40/3/307.abstract to http://journals.sagepub.com/doi/abs/10.1177/0010414006286542.

word-wrap:break-word; is also still an option.

adam3smith commented 7 years ago

which it should be anyway, so that's an easy fix.

rmzelle commented 7 years ago

(@zuphilip proposed to use word-break: break-all; at https://github.com/citation-style-language/csl-editor/pull/206#issuecomment-275853370)