| Autor |
Nachricht |
miras
Threadersteller
Dabei seit: 19.05.2004
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 23.11.2005 12:25
Titel
|
  |
|
aller Anfang ist schwer, also ich bin jezt schon ein wenig weitergekommen. Aber....
...ist es nicht so das sich die Elemente an ihrem Elternelement orientieren? Wenn ich also einem DIV eine Höhe von 100% gebe, dürfte er sie doch nur so hoch machen wie das Elternelement hoch ist, oder habe ich da einen denkfehler?
Zur Erklärung:
Ein DIV aussenrum, zentriert und hat einen Rahemn von einem Pixel, in diesem dann mehrere andere Divs.
der Code
html
| Code: |
<div id="wrapper">
<div id="header">
<img src="img/re_1.jpg" width="189" height="93" alt="" border="0"><img src="img/slogan.gif" width="521" height="93" alt="" border="0">
</div>
<div id="rechts">
<img src="img/re_2.jpg" width="189" height="174" alt="" border="0"><br />
<img src="img/re_3.jpg" width="189" height="140" alt="" border="0"><br />
<img src="img/re_4.jpg" width="189" height="120" alt="" border="0">
</div>
</div> |
css: | Code: |
#wrapper{
border: 1px solid #840400;
width:900px;
height:600px;
position: absolute;
left: 50%;
margin-top:10px;
margin-left:-450px;
}
#rechts{
position:absolute;
height:100%;
top:93px;
background-color:830707
} |
es geht jetzt um das DIV #rechts, mit der Angabe der top:93px orientiert es sich am Übergeordneten DIV, das klappt.
Nun habe ich dort 3 Bilder drin und wollte als background eine Farbe nehmen, so das immer bis zum rahmen von #wrapper halt diese Farbe ist, nehme ich jetzt height 100%, macht er die Größe aber bis zum Browserrand, lässt sich also von der Größe des Elternelementes nicht beeindrucken. Ich könnte ihm jetzt eine feste Größe geben, das bringt aber wieder nichts, da ja der Content immer unterschiedlich ist.
Was kann ich da tun das er die 100% zum übergeordneten DIV bezieht, gehts überhaupt?
Hoffe habs halbwegs verständlich erklärt.
hier mal noch nen Link
klick
besten dank schonmal
Zuletzt bearbeitet von miras am Mi 23.11.2005 14:35, insgesamt 1-mal bearbeitet
|
|
| |
  |
 |
way2hot
Dabei seit: 14.03.2004
Ort: Jüchen-Gierath
Alter: 41
Geschlecht: 
|
Verfasst Mi 23.11.2005 12:43
Titel
|
|
|
| miras hat geschrieben: | | Was kann ich da tun das er die 100% zum übergeordneten DIV bezieht, gehts überhaupt? |
Also: Ich würde versuchen, auf absolute DIVs so gut es geht zu verzichten, das was du versuchst zu erreichen geht wunderbar mit float und Positionierung über margin. Da dein Eltern-Element eine fest Höhe hat, kannst du dem DIV #rechts doch einfach
zuweisen oder du setzt direkt eine Größenangabe ein, die dem des Eltern-Elements #wrapper entspricht.
Soll die Seite sich in der Höhe nachher dem Inhalt anpassen oder bleibt die bei 600px? Grundsätzlich würde ich so oder so auf die absolute Positionierung verzichten und stattdessen den #wrapper einfach mittels
| Code: | width: 900px;
height: 600px;
margin: 10px auto 0 auto; |
definieren.
|
|
| |
 |
|
|
Anzeige
|
|
|
Nimroy
Community Manager
Dabei seit: 26.05.2004
Ort: zwischen Köln und D'dorf
Alter: 45
Geschlecht:
|
Verfasst Mi 23.11.2005 12:56
Titel
|
|
|
| miras hat geschrieben: | @raumwurm
klick
@nimroy
habs jetzt so, funzt auch net
| Code: |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Unbenannt</title>
</head>
<body>
<div style="position:absolute;background-color:green;blue;width:500px;height:300px;margin-right:auto;margin-left:auto">
blabla
</div>
</body>
</html>
|
|
Mach mal
|
|
| |
|
|
way2hot
Dabei seit: 14.03.2004
Ort: Jüchen-Gierath
Alter: 41
Geschlecht:
|
Verfasst Mi 23.11.2005 12:59
Titel
|
|
|
| Nimroy hat geschrieben: | | Mach mal |
Oder lass es ganz weg. 
|
|
| |
|
|
miras
Threadersteller
Dabei seit: 19.05.2004
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 23.11.2005 13:02
Titel
|
|
|
danke erstmal, wie gesagt bin GANZ neu auf dem Gebiet:
hab jetzt dem #rechts "height: inherit;" verpasst es ändert sich aber leider nichts, so hattest du es doch aber gemeint oder?
EIne feste Größe kann ich nicht zuweisen das der Content mal kurz oder mal lang (zum scrollen) sein kann.
Wie meinst du das mit auf "absolute" verzichten?Nur mit relativ arbeiten? Aber dann bezieht er sich doch gar nicht mehr auf die übergeordneten Elemente oder hab ich mich da falsch belesen?
|
|
| |
|
|
miras
Threadersteller
Dabei seit: 19.05.2004
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 23.11.2005 13:04
Titel
|
|
|
mit relative oder ganz ohne, funzt es auch nicht 
|
|
| |
|
|
miras
Threadersteller
Dabei seit: 19.05.2004
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 23.11.2005 14:40
Titel
|
|
|
achso und dann schaut euch mal bitte die Seite im IE und im FF an, im IE ist der Navibalken 1-2px länger als im FF (da schließt er genau ab), was hab ich denn da schon wieder falsch gemacht? 
Aber das größere Problem bleibt immer noch das mit der Backgroundfarbe rechts 
link
code css:
| Code: |
/*BEGINN index*/
#start{
position: absolute;
top: 50%;
left: 50%;
width: 378px;
margin: -120px 0 0 -185;
}
p.start{
text-align:center;
color:ED8A8A;
font-family:Arial;
font-size:8pt;
}
/*END index */
/*BEGINN main*/
#wrapper{
border: 1px solid #840400;
width:900px;
height:500px;
position: absolute;
left: 50%;
margin-top:10px;
margin-left:-450px;
}
#rechts{
position:absolute;
height: inherit;
top:93px;
background-color:830707;
}
/*END main*/
/*BEGINN navi*/
#navi{
position:absolute;
top:93px;
left:189;
width:712px;
height:19px;
background-color:830707;
}
.nav1{
padding-left:80px;
}
.nav2bis4{
padding-left:100px;
}
/*END navi*/ |
code html:
| Code: |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Unbenannt</title>
<link rel=stylesheet type="text/css" href="styles.css">
</head>
<body>
<div id="wrapper">
<div id="header">
<img src="img/re_1.jpg" width="189" height="93" alt="Vektor-Massivhaus" border="0"><img src="img/slogan.gif" width="521" height="93" alt="Vektor-Massivhaus, Wir bauen fuer Sie..." border="0">
</div>
<div id="rechts">
<img src="img/re_2.jpg" width="189" height="174" alt="Vektor-Massivhaus" border="0"><br />
<img src="img/re_3.jpg" width="189" height="140" alt="Vektor-Massivhaus" border="0"><br />
<img src="img/re_4.jpg" width="189" height="120" alt="Vektor-Massivhaus" border="0">
</div>
<div id="navi">
<span class="nav1"><img src="img/navi/ueber_uns.gif" width="55" height="18" alt="Vektor-Massivhaus, Ueber uns" border="0"></span>
<span class="nav2bis4"><img src="img/navi/referenzen.gif" width="66" height="18" alt="Vektor-Massivhaus, Referenzen" border="0"></span>
<span class="nav2bis4"><img src="img/navi/angebote.gif" width="57" height="18" alt="Vektor-Massivhaus, Angebote" border="0"></span>
<span class="nav2bis4"><img src="img/navi/kontakt.gif" width="45" height="18" alt="Vektor-Massivhaus, Kontakt" border="0"></span>
</div>
</div>
</body>
</html>
|
muss ich da jetzt ne Browserabfrage machen und dann halt ne css-file für FF und IE (wo der navibalken dann 2px kleiner ist)haben?
thanx
Zuletzt bearbeitet von miras am Mi 23.11.2005 14:48, insgesamt 1-mal bearbeitet
|
|
| |
|
|
miras
Threadersteller
Dabei seit: 19.05.2004
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 23.11.2005 15:43
Titel
|
|
|
oh man, ich glaub Tabellen liegen mir doch einfacher *heul*
link
warum passt der das umliegende DIV nicht an den Content an, och menno
wie gesagt bin für jede HIlfe dankbar
die miras
Zuletzt bearbeitet von miras am Mi 23.11.2005 16:21, insgesamt 1-mal bearbeitet
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
mittig positionieren ...
CSS : Mittig positionieren. Hilfe!
grafik mit css mittig positionieren
Seite mittig positionieren via css
jquery slideshow mittig positionieren
HTML/CSS UL mit IMG mittig?
|
|
Willkommen auf dem Portal für Mediengestalter
