zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden absolut positioniertes Element an anderem Elternelement orientieren lassen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 08.04.2009, 23:49
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.10.2007
Beiträge: 18
schrepfer befindet sich auf einem aufstrebenden Ast
Standard absolut positioniertes Element an anderem Elternelement orientieren lassen

Hi

Ich habe folgende Ausgangslage: Ein Elternelement, das mehrere Tochterelemente beinhaltet, die alle auf das Elternelement Bezug nehmen. Alle Tochterelemente sollen absolut positioniert werden, wie dies in der angehängten Grafik der Fall ist. Hat jemand eine Idee..?

edit: Sorry, für die zu schnelle Fragestellung im Forum, habe die Antwort selber rausgefunden. (Mit Listenelementen, die lassen sich überall positionieren)

Freundliche Grüsse
schrepfer
Angehängte Grafiken
Dateityp: jpg Unbenannt.JPG (4,3 KB, 6x aufgerufen)

Geändert von schrepfer (09.04.2009 um 00:33 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 09.04.2009, 00:48
Benutzerbild von emti
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 03.06.2008
Ort: 23816 Groß Niendorf
Beiträge: 700
emti sorgt für eine eindrucksvolle Atmosphäreemti sorgt für eine eindrucksvolle Atmosphäre
Standard

Dem Elternelement position: relative geben.
__________________
Gruß Michael
SketchAtomTransmit
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 09.04.2009, 00:50
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.10.2007
Beiträge: 18
schrepfer befindet sich auf einem aufstrebenden Ast
Standard

Nun, dadurch kann jedoch nur ein div- oder span-Element positioniert werden, da sich das nächste am vorherigen orientiert. Doch mit Listenelementen hat's geklappt!
Mit Zitat antworten
  #4 (permalink)  
Alt 09.04.2009, 00:57
Benutzerbild von emti
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 03.06.2008
Ort: 23816 Groß Niendorf
Beiträge: 700
emti sorgt für eine eindrucksvolle Atmosphäreemti sorgt für eine eindrucksvolle Atmosphäre
Standard

Positionierung ? Einführung in XHTML, CSS und Webdesign
Zitat:
Die Box wird relativ zu ihrem umschließenden Block verschoben. Dabei gilt es folgendes zu beachten. Der umschließende Block für eine absolut positionierte Box wird durch das nächste positionierte Elternelement oder, falls es kein solches gibt, durch den äußersten umschließenden Block gebildet. Im Allgemeinen können Sie davon ausgehen, dass ein Element relativ zum Viewport, also zum Browserfenster, ausgerichtet wird, wenn kein positioniertes Vorfahrenelement gefunden wird.
__________________
Gruß Michael
SketchAtomTransmit
Mit Zitat antworten
  #5 (permalink)  
Alt 09.04.2009, 01:11
Benutzerbild von emti
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 03.06.2008
Ort: 23816 Groß Niendorf
Beiträge: 700
emti sorgt für eine eindrucksvolle Atmosphäreemti sorgt für eine eindrucksvolle Atmosphäre
Standard

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-language" content="de" />

<title>Testcase</title>

<style type="text/css">
* {margin: 0; padding: 0;}

#wrapper {
   border: 1px solid #000;
   height: 600px;
   position: relative;
   margin: 30px 0 0 30px;
   width: 600px;
}

#box1, #box2, #box3 {
   background-color: #68838B;
   height: 100px;
   padding: 5px 0 0 5px;
   width: 150px;
}

#box1 {
   position: absolute;
   top: 0;
   left: 0;
}

#box2 {
   position: absolute;
   top: 0;
   right: 0;
}

#box3 {
   position: absolute;
   bottom: 0;
   left: 0;
}
</style>
</head>
<body id="startseite">
   <div id="wrapper">
      <div id="box1">Box 1</div>
      <div id="box2">Box 2</div>
      <div id="box3">Box 3</div>
   </div> <!-- Ende wrapper -->
</body>
</html>
__________________
Gruß Michael
SketchAtomTransmit
Mit Zitat antworten
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
Seite wird auf anderem Computer falsch dargestellt Patrick Egli CSS 3 01.11.2009 11:40
IE6 - nur teilweise gerenderter Hintergrund durch absolut positioniertes Element? shredder01 CSS 0 20.10.2009 15:13
Festanstellung bei der Xing AG als Web Developer (HTML/CSS) NEOX Offtopic 10 17.07.2008 18:11
Element relativzu anderem Element positionieren Gsicht Javascript & Ajax 7 21.02.2008 08:20
Element teils absolut, teils fixiert positioniert pod-o-mart CSS 0 13.05.2006 02:03


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:36 Uhr.