tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
4
ZUGRIFFE
227
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. 06.08.11 08:17 #1
    Nicolai Krüger Nicolai Krüger ist offline Grünschnabel
    Registriert seit
    Jul 2011
    Beiträge
    2
    Hallo,

    ein altbekanntes Problem, dennoch erziele ich hier keine Lösung und bitte um Hilfe.
    Zwischen Kopf- und Fußzeile ist neben dem Hauptbereich (maincontainer) auch eine Seitenleiste (ads) anzuzeigen (siehe Anhang -> rotes DIV). Die Höhe soll sich logischerweise über die gesamte Höhe des Hauptbereiches dynamisch erstrecken.

    CSS (Blueprint Framework)
    Code :
    1
2
3
4
5
6
7
8
9
10
11
12

    body {line-height:1.5;background:white;height:100%}
 
#maincontainer {
min-height: 100%; 
height:auto !important; 
height:100%;    
}
 
#ads {
background-color:#e9e8e8;
height:100%;
}

    Vielen Dank!
    Nicolai
    Miniaturansicht angehängter Grafiken Miniaturansicht angehängter Grafiken Div zwischen Kopf- und Fußzeile-divs.jpg  
     
    Zitieren Zitieren
  2. 06.08.11 22:05 #2
    Avatar von hela
    hela hela ist offline Mitglied Smaragd
    tutorials.de Premium-User
    Registriert seit
    Oct 2004
    Beiträge
    1.123
    Hallo,

    das ist zu wenig Information, um dir helfen zu können. Man erkennt nur, dass es zwei Elemente mit 100% Höhe gibt. Das passt aber nicht zum angehängten Bild.

    Vermutlich hast du zum Bild auch das passende HTML. Wäre prima, wenn du das hier zeigen könntest. Ansonsten ist das CSS bedeutungs- und beziehungslos, weil es nur im Zusammenhang mit dem Markup Sinn macht.
     
    Zitieren Zitieren
  3. 07.08.11 15:15 #3
    Nicolai Krüger Nicolai Krüger ist offline Grünschnabel
    Registriert seit
    Jul 2011
    Beiträge
    2
    Hallo,

    klar:
    Code :
    1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

     
<html>
<head>
...
</head>
<body>
<div class="span-24" id="head">Header</div>
<div class="span-24" last id="maincontainer">
   <div class="span-18" >
   Text 1
   </div>
   
   <div class="span-6 last" id="ads">
   Rechte Spalte
   </div>
 
</div> 
<div class="span-24" id="footer">Footer</div>
 
</div>
</body>
</html>
     
    Zitieren Zitieren
  4. 08.08.11 14:38 #4
    marco_ru marco_ru ist offline Mitglied Bronze
    Registriert seit
    Aug 2011
    Beiträge
    36
    den content kannste mit float:left; nach links schieben
    und die rote spalte mit float:right;
     
    Zitieren Zitieren
  5. 10.08.11 12:04 #5
    Avatar von hela
    hela hela ist offline Mitglied Smaragd
    tutorials.de Premium-User
    Registriert seit
    Oct 2004
    Beiträge
    1.123
    Hallo,

    für dein Layout wäre eine Festlegung der Höhe für Kopf- und Fußbereich sinnvoll. Außerdem müsstest du dir Gedanken darüber machen, was bei einer Höhenüberschreitung des Inhalts vom "maincontainer" und vom Seitenblock passieren soll. Falls die Blöcke separat scrollbar sein sollen, dann könntest du sie absolut positionieren, so wie das hier beschrieben ist:
    Tabellenloses Basislayout mit fixierten und separat scrollbaren Blöcken

    P.S.:
    Habe gerade gesehen, dass das oben verlinkte Tutorial nicht mehr vollständig ist. Hier der Link, mit dem das vollständige Tutorial heruntergeladen werden kann:
    http://www.tutorials.de/attachments/...utorial_v2.zip
    Geändert von hela (10.08.11 um 12:34 Uhr) Grund: Ergänzung
     
    Zitieren Zitieren
« menu dropdown | Probleme mit der Anzeige in verschiedenen Browsern. Bitte um Ratschläge! »

Ähnliche Themen

  1. kopf und fußzeile nicht mit drucken
    Von c_83 im Forum Visual Basic 6.0
    Antworten: 0
    Letzter Beitrag: 02.10.07, 12:04
  2. Kopf-/Fußzeile für den Ausdruck
    Von hikeda_ya im Forum PHP
    Antworten: 6
    Letzter Beitrag: 06.07.06, 14:58
  3. Variable Höhe für Navi-DIV zwischen Kopf- und Fußzeile
    Von 27apricot im Forum CSS
    Antworten: 5
    Letzter Beitrag: 19.06.05, 20:43
  4. Kopf / Fußzeile
    Von Uller im Forum CSS
    Antworten: 0
    Letzter Beitrag: 30.01.05, 11:33
  5. drucken ohne Kopf & Fußzeile
    Von stormystormy im Forum Javascript & Ajax
    Antworten: 1
    Letzter Beitrag: 26.08.03, 10:30