3divs mit versch. hg-grafiken für variablen inhalt

3divs mit versch. hg-grafiken für variablen inhalt

Beitragvon malte » 17.10.2010, 02:17

Moinsen @ all,
Ich habe folgende Probleme:
(1) Auf meiner Seite soll es zwischen Kopf und Fußbereich einen Bereich mit variablem Inhalt geben...soweit kein Problem dank height: auto. Schwierig wird das ganze allerdings daurch, dass dieser Bereich drei getrennte, nebeneinander angeordnete Hintergrundgrafiken enthalten soll, die dem Inhalt entsprechend auf der y-Achse wiederholt werden sollen.
(Zur Erklärung: Ich habe den ursprünglichen Rapport in drei Teile geschnitten, damit ich nur für den linken und rechten Rand, wo ich Transparenz brauche, PNG verwenden kann und den Hauptteil in der Mitte als JPG mit optimalem Speicherbedarf exportieren kann)
Daraus ergibt sich das Problem, dass ich nicht weiß wie ich dafür sorgen kann, dass der jeweilige Inhalt die Höhe für alle 3 divs gleichzeitig vorgibt und der Rapport daher im jetzigen Zustand nur in der Mitte funzt, wo der Text steht.

(2) Falls das irgendwie hinhauen sollte, muss der Fußbereich natürlich auch wieder sauber an den variablen Inhalt andocken. Auch dabei weiß ich mir keinen Rat.

Ich hoffe diese Frage ist für euch nicht zu simpel, als dass sie würdig wäre im Fortgeschrittenen-Forum beantwortet zu werden aber ich hatte beim Überfliegen den Eindruck, dass es im Anfänger Forum um weitaus basalere Probleme geht...ansonsten "sorry", kommt nicht wieder vor.

Hier also der Code um den es geht oder ihr schaut euch das ganze unter http://www.mapo.zzl.org mal in Natura an. (Befindet sich noch im Embryonalstadium)
Ich bedanke mich schonmal im Voraus, Malte

<div id="kopf">
<div id="kopf-oben"></div>
<div id="kopf-links"></div>
<div id="kopf-mitte"></div>
<div id="kopf-rechts"></div>
</div>

<div id="inhalt">
<div id="inhalt-links"></div>
<div id="inhalt-mitte">
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben. Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt.
<div id="inhalt-rechts"></div>
</div>

<div id="fusz">
<div id="fusz-links"></div>
<div id="fusz-mitte"></div>
<div id="fusz-rechts"></div>
<div id="fusz-unten"></div>
</div>

#inhalt {
position: absolute;
width: 1024px;
top: 158px;
}

#inhalt-links {
background-image: url(../bilder/leinwand-rapport-links.png);
position: absolute;
height: auto;
width: 4px;
background-repeat: repeat-y;
}
#inhalt-mitte {
background-image: url(../bilder/leinwand-rapport-mitte.jpg);
position: absolute;
height: auto;
width: 987px;
left: 4px;
background-repeat: repeat-y;
}
#inhalt-rechts {
position: absolute;
height: auto;
width: 33px;
left: 991px;
background-image: url(../bilder/leinwand-rapport-rechts.png);
background-repeat: repeat-y;
}
malte
neu hier
 
Beiträge: 8
Registriert: 17.10.2010, 01:17

Re: 3divs mit versch. hg-grafiken für variablen inhalt

Beitragvon sejuma » 17.10.2010, 07:31

Zu 1:
Verzichte mal zunächst auf alle absoluten Positionierungen, weil die absolut unnötig sind.

Bastle dir aus deinen drei Grafikteilen links/mitte/rechts eine einheitliche Querschnittsgrafik.
Weise die einem #wrapper zu.
Innerhalb des #wrapper fügst du deine drei divs ein und gibst denen ein "float: left;"
Vor Schließen des #wrapper clearen.
Wie das funktioniert ist hier nochmal näher erklärt: http://www.ohne-css.gehts-gar.net/0005.php

zu 2:
Den footer kannst du entweder vor Schließen des #wrapper einbauen oder danach.
Eine weitere Möglichkeit ist diese:
http://www.ohne-css.gehts-gar.net/0044.php
Bild
sejuma
Vielposter
 
Beiträge: 805
Registriert: 15.07.2009, 17:46


Moderatoren: Laus, Moderatoren

Ähnliche Beiträge zu "3divs mit versch. hg-grafiken für variablen inhalt"

Zurück zu: CSS für Fortgeschrittene

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 4 Gäste