diff options
| author | Zhiming Wang <zmwangx@gmail.com> | 2015-12-26 02:33:36 -0800 |
|---|---|---|
| committer | Zhiming Wang <zmwangx@gmail.com> | 2015-12-26 02:33:36 -0800 |
| commit | 3890e82f339dbf5dc29d9cffc8d7c26b99293fc1 (patch) | |
| tree | 091dbbef019c359e16d327a39af52cdd86b24b17 | |
| parent | b0027d2dbdba7f97ca07d8dac6fc28fe53c11a42 (diff) | |
| download | my_new_personal_website-3890e82f339dbf5dc29d9cffc8d7c26b99293fc1.tar.xz my_new_personal_website-3890e82f339dbf5dc29d9cffc8d7c26b99293fc1.zip | |
theme.css and template.html: Solve overflow problem in code and a tags
Over-long inline <code> tag or long literal link in <a> tag used to
overflow the container. This is especially bad on phones where width is
very limited. This commit hopefully solves the overflow problem. Still
no smarter word breaking, but it's probably just an unfortunate
limitation of HTML.
Diffstat (limited to '')
| -rw-r--r-- | source/css/theme.css | 5 | ||||
| -rw-r--r-- | templates/template.html | 1 |
2 files changed, 5 insertions, 1 deletions
diff --git a/source/css/theme.css b/source/css/theme.css index 2394024e..74522d24 100644 --- a/source/css/theme.css +++ b/source/css/theme.css @@ -107,12 +107,15 @@ h2 { a { color: #333; + word-wrap: break-word; } code { font-size: 0.95em; color: #777; font-family: 'Droid Sans Mono', 'Courier', monospace; + white-space: pre-wrap; + word-wrap: break-word; } pre { @@ -131,6 +134,8 @@ pre code { font-size: 0.91em; line-height: 135%; color: #333; + white-space: pre; + word-wrap: normal; } blockquote { diff --git a/templates/template.html b/templates/template.html index 2b0115d7..ec6fad90 100644 --- a/templates/template.html +++ b/templates/template.html @@ -20,7 +20,6 @@ $endif$ <link href="/css/theme-narrow.css" media="only screen and (max-width: 1023px)" rel="stylesheet" type="text/css"/> <link href="/css/theme-ultranarrow.css" media="only screen and (max-width: 500px)" rel="stylesheet" type="text/css"/> <link href="/css/print.css" media="print" rel="stylesheet" type="text/css"/> - <style type="text/css">code{white-space: pre;}</style> $if(highlighting-css)$ <style type="text/css"> $highlighting-css$ |