X-Git-Url: https://juplo.de/gitweb/?p=website;a=blobdiff_plain;f=src%2Fmain%2Fwebapp%2Fless%2Fscreen%2Flayout.less;h=16dcfb23f325509a80f8858e7dc463ff4825425d;hp=e99be0446ca2ad68e1efd6ed2a20dfbba0081038;hb=755196d54dfd443a1be08576cd316335e55ec50c;hpb=173a4c37630f1d30aacc1ab5af8d0f57adc234b3 diff --git a/src/main/webapp/less/screen/layout.less b/src/main/webapp/less/screen/layout.less index e99be044..16dcfb23 100644 --- a/src/main/webapp/less/screen/layout.less +++ b/src/main/webapp/less/screen/layout.less @@ -1,17 +1,22 @@ -@import '../variables.less'; - body { - padding: 1em 3em 1em 5em; + padding: 0 3em 0 5em; +} + +#header +{ + margin-left: -2.125em; } .content { position: relative; + height: 100%; + padding-bottom: 7.1875em; /** 115px (gemessene Gesamthöhe des Footers - mit Abstand und Margin) */ } .cols_2 > .content { - padding: 0 27em 0 0; + padding-right: 27em; margin-right: -24.375em; } .cols_2 > .content > .main @@ -23,7 +28,7 @@ body } .cols_1 > .content > .marginal { - margin: 3em 0; + margin-top: 3em; background-color: @heller; } .cols_2 > .content > .marginal @@ -49,7 +54,7 @@ body { margin-top: 0; } -.cols_1 > .content > .marginal div.m +.cols_1 > .content > .marginal aside.m { padding: 2em; } @@ -57,6 +62,7 @@ body { position: absolute; top: 0; + right: 0; /** Hier eigentlich nicht nötig, aber für Tablet-Style erforderrlich! */ width: 100%; } .cols_2 > .content #nav @@ -85,16 +91,37 @@ body { overflow-y: scroll; } #page { max-width: 62.375em; /** 608px + 390px (Marginalspalte) = ca. 1000px */ - position: relative; margin: 0 auto; } +/** Make the footer sticky */ +html, body +{ + height: 100%; +} +#page +{ + position: relative; + min-height: 100%; +} +#footer +{ + position: absolute; + left: 0; + right: 0; + bottom: 0; +} + /** Faux-Column-Hack-Eigengewächs */ #page.cols_2 { max-width: 38em; /** 608px + 390px (Marginalspalte) = ca. 1000px */ border-right: 24.375em solid @heller; } +#header +{ + padding-top: 1em; +} .cols_2 > #header { margin-right: -24.375em;