div boxen bei Fesnter größen änderung

Status
Nicht offen für weitere Antworten.
js-mueller

js-mueller

Erfahrenes Mitglied
Hi ich hab ein Problem bei meiner Seite. Ich habe Design bedingt 5 div boxen in einer reihe.
So wenn ich das Browser Fesnter nun schmaller werden lasse, verschieben sich die div boxen in die nächste reihe woran mag das liegen? Ich denke mal das hat w<s mit dem float zu tun, aber seht selsbt. ( Bin noch nicht ganz in die html und div techniken reingefuchst, vorher hab ich immer Tabellen benutzt)

Code: 
<?xml version="1.0" encoding="iso-8859-1" ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 STRICT//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtlml1-strict-dtd">

<html xmlns="http://www.w3.org/1999/xhmtl" xml:lang="de">
<head>
</head>
<body>
<div style="width: 100%;">
    <div style="width: 990px; height: 184px; background-image: url('grafiken/index/kopfteil.jpg')"></div>
    <div style="width: 188px; height: 125px; background-image: url('grafiken/index/kopfteil01.jpg'); float: left;"></div>
    <div style="width: 222px; height: 125px; background-image: url('grafiken/index/kopfteil02.jpg'); float: left;"></div>
    <div style="width: 232px; height: 125px; background-image: url('grafiken/index/kopfteil03.jpg'); float: left;"></div>
    <div style="width: 191px; height: 125px; background-image: url('grafiken/index/kopfteil04.jpg'); float: left;"></div>
    <div style="width: 157px; height: 125px; background-image: url('grafiken/index/kopfteil05.jpg'); float: left;"></div>
    <div style="width: 990px; height: 400px; background-image: url('grafiken/index/inhalt.jpg')">
        <p style="width: 150px;  float: left;">Hallo</p>
        <p style="width: 690px; float: left;">Hallo</p>
        <p style="width: 150px; float: left;">Hallo</p>
    </div>
    <div style="width: 990px; height: 72px; background-image: url('grafiken/index/fuss.jpg')"></div>
</div>
</body>
</html>
 
Hi,

es hat etwas mit der Breitenangabe des äusseren Divs zu tun (width: 100%). Hier
solltest Du die Gesamtbreite (width: 990px) der enthaltenen Container als festen
Wert angeben.

Ciao
Quaese
 
Der äußere div ist nur ein test. Es war Ursprünglich ohne ihm.
Also die Breite bleibt 990, aber die eine Grafikreihe rutscht halt stück für stück in die nächste reihe.
Find ich halt recht merkwürde. Ich will Geld für wetten das es an dem float liegt, aber ich weiss net wieso
 
Wieso ist das merkwürdig?

Da das Äußere div nur eine prozentuale Breite hat verhält diese sich dynamisch zur Breite des Browserfensters.
Die divs mit der float-Eigenschaft, machen genau das, was du ihnen gesagt hast: Sie werden von deren anderen Elementen umflossen.

Wenn nun das die Elemente umschließende Elternelement kleiner ist, als die Breite eines gefloateten und eines umfließenden Elementen, so "fließt" lezteres am gefloateten Element vorbei bis es wieder sichtbar oder so sichtbar wie moeglich ist. Und das ist bei einer verkleinerung der Breite nunmal in der nächsten "Reihe".

Ich hoffe, das war einfach genug ausgedrückt ;)
 
Astrein danke nu gehts wenn ich das äußere auf 990px stelle =D
Aber muss ich das also bei jeder Seite machen wo ich float benutze das ich nen Rahmen div benutze? Denn ohne diesen Rahmen div egal ob 990 oder 100% geht es ja net.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück