11.05.2008, 15:13
|
|||
|
|||
(FF only Bug) Image erweitern div nicht -> kein Background
Hallo,
ich bin neu hier im Forum und ich habe direkt auch schon eine Frage. Auf einer Seite die ich gerade mache sollen einzelne Abschnitte in eigene Boxen kommen. Die Boxen bestehen aus drei Teilen da die Ecken rund sein sollen und ich nicht viel von NiftyCorners etc halte. Naja, wie dem auch sei. Es klappt es wunderbar. Bis zu dem Punkt an dem ich ein Bild mit in die Box packen will. Da die Bilder immer rechts erscheinen sollen hab ich sie mit einem float: right; versehen. Und dann ist mir etwas passiert was mir äusserst selten passiert. Im Internetexplorer (ab 6) sieht alles wunderbar aus und funktioniert. Problemkind ist diesmal der Firefox. Das nachfolgende Div (untere Seite der Box) wird zwar von dem Bild verschoben wenn in der Box nicht viel Text steht, allerdings wird der mittelteil der Box nicht erweitert, bzw. nicht wie in dem Teil wo noch Text auftaucht mit dem wiederholenden Hintergrund befüllt. Anbei poste ich den entsprechenden AUszug meiner CSS und der HTML und freue mich auch eure Hilfe. Danke im Vorraus JEwe Code:
.sbbody {
clear: both;
padding-left: 30px;
background-image: url(../img/sidebar_body-trans.gif);
width: 660px;
font-size: small;
margin-top: -18px;
}
.sbbody img {
clear: both;
margin-right: 25px;
margin-left: 25px;
float: right;
}
Code:
<div class="sbtop"> </div><div class="sbbody"> <img src="img/img.gif" alt="Das Bild zum Absatz" /> <p>Hier steht der Text der im zweifelsfall nicht so hoch ist wie das Bild</p> </div><div class="sbfoot"> </div> 
|
| Sponsored Links |
|
11.05.2008, 15:59
|
||||
|
||||
Hallo Jewe,
ich weiß nicht, ob ich Dich richtig verstanden habe, aber Du verwendest "float" und "clear" falsch. So auf die Schnelle: Code:
.sbbody {
float: left;
background-image: url(../img/sidebar_body-trans.gif);
width: 660px;
font-size: small;
margin-top: -18px;
}
.sbbody p {
margin-left: 30px;
}
.sbbody img {
margin-right: 25px;
margin-left: 25px;
float: right;
}
.sbfoot {
clear: both;
width: 660px;
/* Optional */
position: relative;
top: -18px;
}
|
| Sponsored Links |
|
11.05.2008, 20:59
|
|||
|
|||
|
Hallo Emil,
es klappt wunderbar mit deinem Code. Vielen lieben Dank!!! Hab inzwischen auch selber kapiert warum es vorher nicht geklappt hat. War wohl einfach zu blind/blöd ... Danke nochmal und einen sonnigen Gruß Jewe
|
 |
| Stichwörter |
| background, css, firefox, img |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| CSS Problem - Finde den Fehler nicht... | expou | CSS | 4 | 27.04.2011 13:31 |
| Float-Problem? | mischaef | CSS | 33 | 20.10.2010 17:20 |
| Header entfernen | tripple | CSS | 17 | 15.06.2010 16:41 |
| Problem mit einem 3D-Effekt | moep0710 | CSS | 12 | 12.06.2010 15:30 |
| CSS Hack + IE6 + Div + Elternelement | BooKer | CSS | 7 | 12.01.2009 21:03 |
Linear-Darstellung
