[CSS] float

netbandit · 04.05.2009

Hallo,

kann mir vielleicht jemand sagen, was ich im nachfolgenden Html-Code falsch mache?

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Testseite</title>
<meta http-equiv="Content-Language" content="de">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.label01{float: left;
width: 110px;
margin: 1px 0 1px 0;
height: 15px;
}
.form01 {font-family: Verdana, Arial, Helvetica, sans-serif;
color: #003366;
background-color: #eeeeee;
width: 325px;
border-color: #333333 #ffffff #ffffff #333333;
border-style: solid;
border-width: 1px;
margin: 1px 0 1px 0;
height: 15px;
}
</style>
</head>
<body>
 
<div class="label01">Image:</div>
<div class="form01"><img src="img.png" width="70" height="10" alt="x"></div>
</body>
</html>

Div Nr 2 legt sich über das Erste, soll aber daneben sein. Mit Position, Clear und Display erreiche ich gar nichts. Wahrscheinlich falsch eingebaut :uhm:

Danke

d0xId · 04.05.2009

AW: [CSS] float

Ich würd die beiden Layer einfach positionieren. Dem ersten sagts du:

position: absolute;
left:0px;

und dem zweiten
position: absolute;
left: 110px; <----- ist so breit wie dein erster Layer.

greats

netbandit · 04.05.2009

AW: [CSS] float

OK, in dem o.g Beispiel klappt Dein Vorschlag, aaaaaber... Die Website soll hinterher fixe Breite haben und zentriert sein. Klappt so im Moment leider nicht, kann ich das nicht doch irgendwie über float lösen?

mitstreiter · 04.05.2009

AW: [CSS] float

.form01 floaten vll? evtl. nochn hauptcontainer um deine 2 container. ich würde statt class "id" nehmen. den hauptcontainer dann mit margin-left: auto; und margin-right: auto; zentrieren.
<div id="hauptcontainer">
<div id="label01"></div>
<div id="form01">deinbild</div>
</div>

das bild kannste norm. auch in den container form01 hauen. als bg bild!

netbandit · 04.05.2009

AW: [CSS] float

Die Divsuppe kann öfter (2-3 Mal) auf einer Seite vorkommen, also ohne id;

Habe jetzt mal eben mit margin: 1px 0 1px 110px in form01 ausprobiert, alles andere so gelassen. Scheint zu funktionieren (IE, NS, OP, FF und Safari). Ob das allerdings so OK ist, k.A!? :uhm:

omega_pi · 04.05.2009

AW: [CSS] float

Hallo netbandit,

Probiers doch mal mit

Code:

<html>
<head>
    <title></title>
</head>
<body>
        <div id="body">
            <div id="a"> </div>
            <div id="b"> </div>
        </div>
</body></html>

und diesem css

Code:

body {
    background-color: #ffffff;
    padding: 0px;
    text-align: center;
    font-family: arial;
    font-size: 12px;
}
#body {
    text-align: left;
    margin: auto;
    width: 720px;
    height: 600px;
    background: yellow;
}
#a {
    float: left;
    width: 500px;
    height: 400px;
    background: green;
    margin: 2px;
}
#b {
    float: left;
    width: 200px;
    height: 600px;
    background: red;
    margin: 2px;
}

nicht erschrecken, die knackigen Farben sind nur zur Veranschaulichung

netbandit · 04.05.2009

AW: [CSS] float

umpf; Danke omega_pi. Lag also nur daran, dass in form01 auch noch ein float:left rein musste. Alles mögliche ausprobiert, nur das nicht. :hmpf:
Danke nochmal

mitstreiter · 05.05.2009

AW: [CSS] float

lol, genau das hab ich oben schon mal geschrieben.... naja...

form01 floaten vll?

wie aufmerksam hier die posts gelesen werden...

netbandit · 05.05.2009

AW: [CSS] float

mitstreiter schrieb:
lol, genau das hab ich oben schon mal geschrieben.... naja...
wie aufmerksam hier die posts gelesen werden...

Tut mir leid, hast recht. Nachdem ich ein Templatesystem komplett von Tabellen befreit habe, war ich nicht mehr wirklich bei der Sache, tschuldigung & Dir auch ein Dankeschön