From 23aaa5ac45f389a741afdac6d87e077a2e44fe8b Mon Sep 17 00:00:00 2001 From: Joey Hess Date: Thu, 10 Jun 2010 14:14:46 -0400 Subject: [PATCH] style.css: Improvements to make floating sidebar fit better on pages with inlines. The key is using width: auto; overflow: auto; -- this allows the div(s) to the left of the floating sidebar to be resized to fit next to it, and prevents any clear: both from pushing the div down below the end of the sidebar. Many thanks for the Hurd wiki's developers for originally figuring this out. The edit page recently developed the same problem with its textarea, now that a sidebar can appear on that page too. In editpage.tmpl I needed to add a new div around the editcontent textarea, as the above styles cannot be applied directly to textareas. The textarea's own width is reduced to 98% because at least in chromium this avoids it getting unnecessary horizonatl scrollbars when a sidebar is displayed next to it. --- debian/changelog | 2 ++ doc/style.css | 12 +++++++++--- templates/editpage.tmpl | 2 ++ 3 files changed, 13 insertions(+), 3 deletions(-) diff --git a/debian/changelog b/debian/changelog index abf7a2d87..f7810c66f 100644 --- a/debian/changelog +++ b/debian/changelog @@ -11,6 +11,8 @@ ikiwiki (3.20100609) unstable; urgency=low * editpage: Avoid storing accidental state changes when previewing pages. * page.tmpl: Add a div around the sidebar, page content, and comments, to aide in styling. + * style.css: Improvements to make floating sidebar fit better on + pages with inlines. -- Joey Hess Mon, 31 May 2010 20:44:17 -0400 diff --git a/doc/style.css b/doc/style.css index 2cd7a9652..d88c93778 100644 --- a/doc/style.css +++ b/doc/style.css @@ -110,7 +110,12 @@ nav { } #editcontent { - width: 100%; + width: 98%; +} + +.editcontentdiv { + width: auto; + overflow: auto; } img { @@ -121,8 +126,8 @@ div.recentchanges { border-style: solid; border-width: 1px; overflow: auto; - clear: both; - width: 100%; + width: auto; + clear: none; background: #eee; color: black !important; } @@ -176,6 +181,7 @@ div.recentchanges { .inlinepage { padding: 10px 10px; border: 1px solid #aaa; + overflow: auto; } .pagedate, diff --git a/templates/editpage.tmpl b/templates/editpage.tmpl index 118ca4550..36076cb35 100644 --- a/templates/editpage.tmpl +++ b/templates/editpage.tmpl @@ -17,7 +17,9 @@
  • +

    +
  • -- 2.26.2