zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden 3 Horizontale Bereiche

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 28.06.2013, 12:40
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 28.06.2013
Beiträge: 1
BadBunny befindet sich auf einem aufstrebenden Ast
Standard 3 Horizontale Bereiche

Hallo, ich möchte gerne eine Seite erstellen die in etwa so aussieht wie im Anhang.
Höhe jeweils 33%.

Was bei mir bereits funktioniert ist das aufteilen in 2 Bereiche, bräuchte allerdings 3 Horizontale bereiche.

Code:
#top_div {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 50%;
    text-align: center;
}
#bottom_div {
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    bottom: 0;
    text-align: center;
}
Das funktioniert zumindest für 2 wunderbar. Leider aber nicht wenn ich versuche noch einen Bereich für die Mitte zu definieren der bei 33% beginnt und bei 66% aufhört. Das hat zur Folge dass im oberen Bereich ein horizontaler Strich erscheint statt die gewünschte Aufteilung.

Bin für Hilfe dankbar
Angehängte Grafiken
Dateityp: png test.png (1,2 KB, 7x aufgerufen)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 28.06.2013, 13:44
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 30.04.2012
Beiträge: 163
schatzi sorgt für eine eindrucksvolle Atmosphäreschatzi sorgt für eine eindrucksvolle Atmosphäre
Standard

Hallo!

Wenn du allen Elternelementen die Höhe 100% gibst, kannst du dir das ganze Positionieren sparen:
HTML-Code:
html,body,#wrapper{height:100%;}
.drittel{height:33.333%;}
HTML-Code:
<div id="wrapper">
<div class="drittel">oben</div>
<div class="drittel">mitte</div>
<div class="drittel">unten</div>
</div>
__________________
Gruß schatzi
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
horizontale Siteverschiebung REFRESH (X)HTML 5 13.10.2010 17:24
Horizontale Liste mit breiteren Unterpunkten Korasu CSS 3 12.05.2009 10:00
[CSS] Horizontale Navigation mit DropDown coly CSS 0 28.12.2008 14:06
Horizontale Scrollleiste ausblenden kopfaquarium CSS 1 31.03.2007 00:21
Horizontale Navigation mit Rollovergrafiken – mit CSS? Kirsten CSS 6 04.06.2006 12:57


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:50 Uhr.