Stefen Baetge: Probleme mit float im Mozilla

SELF-Forum

Probleme mit float im Mozilla

Stefen Baetge
– Informationen zu den Bewertungsregeln

Hallo zusammen,

ich habe vier Text/Bild-Bereiche, die in zwei Zeilen, jeweils zwei nebeneinander dargestellt werden sollen. Der Einsatz von float funzt im IE wunderbar (siehe angehängter Screenshot), allerdings packt der Mozilla alle vier Bereiche untereinander.

Hier mal ein kurzer Auszug aus dem Quellcode:
.inhalt {
 margin-top:40px;
 margin-left:10px;
 margin-right:10px;
}
.projekt {
 float:left;
 width:365px;
 margin-right:20px;
 margin-bottom:35px;
}
.hilfe, .login {
 width:365px;
}
.aktuell {
 clear:left;
 float:left;
 width:365px;
 margin-right:20px;
}

<div class="inhalt">
 <div class="projekt">
 <a href="#"><img src="gif/projekt.jpg" width="120" height="85" border="0" hspace="0" vspace="2" align="left" alt="Alles über das Projekt"></a><div class="head" style="margin-left:130px;"><a href="#">Alles über das Projekt</a></div>
 <div class="text12schwarz" style="margin-left:130px;">Lorem ipsum dolor Sit amet, consecteteur adipiscing Epit, sed diam nonumany nibh Euismod tincidunt ut loreum dolore
 magna Aliquam erat volutpat. Lorem ipsum dolor.</div>
 </div>
 <div class="hilfe">
 <a href="#"><img src="gif/hilfe.jpg" width="120" height="85" border="0" hspace="0" vspace="2" align="left" alt="Warum und wie anmelden?"></a><div class="head" style="margin-left:130px;"><a href="#">Warum und wie anmelden?</a></div>
 <div class="text12schwarz" style="margin-left:130px;">Lorem ipsum dolor Sit amet, consecteteur adipiscing Epit, sed diam nonumany nibh Euismod tincidunt ut loreum dolore
 magna Aliquam erat volutpat. Lorem ipsum dolor.</div>
 </div>
 <div class="aktuell">
 <a href="#"><img src="gif/aktuell.jpg" width="120" height="85" border="0" hspace="0" vspace="2" align="left" alt="Aktuelles und Termine"></a><div class="head" style="margin-left:130px;"><a href="#">Aktuelles und Termine</a></div>
 <div class="text12schwarz" style="margin-left:130px;">Lorem ipsum dolor Sit amet, consecteteur adipiscing Epit, sed diam nonumany nibh Euismod tincidunt ut loreum dolore
 magna Aliquam erat volutpat. Lorem ipsum dolor.</div>
 </div>
 <div class="login">
 <img src="gif/login.jpg" width="120" height="85" border="0" hspace="0" vspace="2" align="left" alt="Kunden-Login"><div class="head" style="margin-left:130px;">Kunden-Login</div>
 <div class="text12schwarz" style="margin-left:130px;">Lorem ipsum dolor Sit amet, consecteteur adipiscing Epit, sed diam nonumany nibh Euismod tincidunt ut loreum dolore
 magna Aliquam erat volutpat. Lorem ipsum dolor.</div>
 </div>
</div>

Würde mich freuen, wenn irgendjemand ein kleinen Tipp hätte, wie ich auch den Mozilla von der "richtigen" Darstellung überzeugen könnte ;-)

Thx Stefen

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Probleme mit float im Mozilla

    Cyx23
    – Informationen zu den Bewertungsregeln

    Hallo Stefen,

    dazu sollte aber doch genug im Archiv zu finden sein?

    Z.B. so:

    .hilfe, .login {float:left}

    ggf. noch per CSS-Weiche an einzelne Browser anpassen.

    Grüsse

    Cyx23

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln