nicht angemeldet
Div Container bis zum Seitenfuß
Hallo,
ich bin nun am recherchieren und suchen aber komme leider zu keiner Lösung. Ich möchte gerne eine Spalte an der gesamten Seite bis zum untersten Ende, nicht Bildschirmende, sondern auch bis zum gescrollten Ende durchlaufen lassen.
Diese Spalte soll ganz oben anfangen mit einer Textur anfangen, am Fusse eine andere Textur die eben dort enden soll, und zwischen diesen beiden Texturen eine 1px hohe Textur die das sich von oben bis unten wiederholt.
Klingt ziemlich konfus aber hat schon Sinn für mein Vorhaben. Hier ist mein Ansatzpunkt:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>" >
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/dow_de/css/template.css" type="text/css" />
</head>
<body>
<div id="all">
<div id="left">
<div id="left_bg_top">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/left_bg_top.jpg">
</div>
<div id="left_bg_bottom">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/left_bg_bottom.jpg">
</div>
</div>
<div id="center">
<div id="main">
<div id="logo">
<div id="logo_left">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/logo.jpg">
</div>
<div id="logo_right">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/logo_right.jpg">
</div>
</div>
</div>
<div id="logo_bottom">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/logo_bottom.jpg">
</div>
<div id="top">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/bg_top.jpg">
</div>
<div id="advert">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/advert.jpg">
</div>
<div id="main_top">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/main_top.jpg">
</div>
<div id="main_bg">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/main_bg.jpg">
</div>
<div id="main_bg">
</div>
<div id="main_bottom">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/main_bottom.jpg">
</div>
<div id="footer_top">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/footer_top.jpg">
</div>
<div id="footer_bottom">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/footer_bottom.jpg">
</div>
</div>
</div>
</div>
Folgende CSS:
html, body {
height: 100%; /* wichtig */
min-height: 100%;
overflow-y: auto;
}
body {
margin: 0px;
padding: 0px;
background-color:#000000;
}
#all {
height: 100%;
min-height: 100%;
posotion:relative;
}
#center {
margin-left: 21px;
height: 100%;
min-height: 100%;
}
#main {
margin: 0px;
padding: 0px;
text-align: center;
}
#left {
float:left;
}
#left_bg_top {
left: 0;
top: 0;
}
#left_bg_middle {
background: #fff url(../images/left_bg.jpg) repeat-y;
min-height: 100%;
}
#left_bg_bottom {
position:static;
bottom:0;
}
#logo {
}
#logo_left {
float: left;
}
#logo_right {
float: left;
padding: 0px;
}
#logo_bottom {
margin: 0px;
padding: 0px;
}
#top {
}
#advert {
}
#main_top {
}
#main_bg {
height: 400px;
background: #fff url(../images/main_bg.jpg) repeat-y;
}
#footer_top {
}
Ich weis, ich machs mir aktuell etwas leicht und ist klar, dass es so nicht klappt. Aber ich habe auch bereits jede Menge andere Experimente gemacht und sie haben leider nicht zum gewünschten Ergebnis geführt.
Danke schon mal für eure Hilfe.
-
Liebe(r) MN.,
<body>
<div id="all">
<div id="left">
<div id="left_bg_top">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/left_bg_top.jpg">
</div>
<div id="left_bg_bottom">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/left_bg_bottom.jpg">
</div>
</div>
<div id="center">
<div id="main">
<div id="logo">
<div id="logo_left">
<img src="<?php echo $this->baseurl ?>/templates/dow_de/images/logo.jpg">
</div>[/code]ich mag keine DIV-Suppe. Schon garkeine sowas von ver-DIV-te. Dein Markup ist nicht sinntragend, ergo sinnfrei. Damit lassen sich kaum sinnvolle Seiten erstellen.
Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)-
Dann sag ich mal vielen Dank? Damit kann ich leider garnichts anfangen.
-
Liebe(r) MN.,
Damit kann ich leider garnichts anfangen.
genau das ist ja mein Anliegen! Ändere die Struktur Deiner Seite zu einer sinnvollen (sprich: Sinn transportierenden), und ich werde beginnen, Deinen Code zu verstehen. So mag ich Dir einfach nicht helfen.
Vielleicht einen anderen Denkanstoß: Egal wie weit eine Sidebar sich tatsächlich nach unten ausdehnt, man kann durch raffinierte Hintergrundbilder den Eindruck erwecken, dass sie sich viel weiter nach unten ausdehnt, als sie das tatsächlich tut...
Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
-
-