2 Elemente in einer Region
Eingetragen von Keymaster (24)am 11.08.2009 - 14:37 Uhr in
Hi,
ich habe ein Problem aus dem ich einfach nicht schlau werde.
Ich habe auf meiner Seite 2 Bilder im Header Bereich, die ich über Position: absolute; versucht habe nebeneinander zu setzen.
Auch habe ich einen eigenen Horizontalen Bereich im Kopf, wo ich Breadcrumbs und Sprachumschaltung einfügen möchte.
Bei beiden habe ich jetzt das Problem das es für einen Noob wie mich beinahe unmöglich ist dieses anständig zu machen.
Wenn ich mit float: right; arbeite ist das zweite Bild nicht mehr in der Header- Region, sondern wird einfach tiefer über meiner Navigation dargestellt.
Nehme ich position: absolut habe ich festgestellt, das ich die beiden Bilder Manuell nicht optisch attraktiv aneinanderfügen kann, denn was im Firefox gut aussieht, sieht im Internet Explorer nicht gut aus und ab und an verändert das Logo auch mal seine Position und ich friemel es dann neu ran, was im laufenden Betrieb nicht passieren sollte.
Kenn sich irgendwer damit aus wie ich diese vermaledeiten Elemente in Frieden nebeneinander stellen kann.
Danke im vorraus.
LG Ben
- Anmelden oder Registrieren um Kommentare zu schreiben
float und clear
am 11.08.2009 - 14:56 Uhr
Moin.
Wenn Du
floatverwendest, bekommt der Container um die "gefloateten" Elemente für gewöhnlich nicht die Höhe der in ihm enthaltenen Elemente, sondern seine Standardhöhe (beim div 0-1px).Das kann man verhindern, indem man noch ein Element in den Container packt und diesem Element ein
clear:bothverpasst.Also in etwa so:
<div id="header"><img class="left" scr="..." alt="..." />
<img class="left" scr="..." alt="..." />
<hr class="clear" />
</div>
und dann im CSS
#header img.left {float: left;
display: inline;
margin: 0 .5em;
}
hr.clear {
clear: both;
height: 0px;
border-width: 0px;
}
So in etwa funktioniert das.
hth,
Stefan
--
sei nett zu Deinem Themer
Danke für die Hilfe, ich
am 11.08.2009 - 15:52 Uhr
Danke für die Hilfe, ich habe jetzt einfach die beiden Bilder zu einem verschmolzen, auch wenn ich das nicht so haben wollte, aber sonst gehts bei mir nur im Firefox ODER IE 7...für das andere habe ich erstmal position absolute genommen.