simon: div elemente plazieren

SELF-Forum

div elemente plazieren

simon
– Informationen zu den Bewertungsregeln

hallo,
ich möchte gerne ein 2-spalten layout mit div's realisieren.
klappt auch alles soweit aber jetzt kommt das problem.
die 2 div's sollen beide in einem großen div drinstecken.
das klappt aber nicht, aus ürgend einem grund wird das "parent" div geschlossen und dann erst werden die beiden spalten-div's angezeigt.
seltsam ist außerdem dass wenn ich bei .right das "float:left;" weglasse, die beiden div's im .all angezeigt werden, allerdings überlappen sie dann und sind nicht nebeneinander.
wäre um jede hilfe dankbar.

simon

############### index.html ###################

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

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title> Simon Michaelis </title>
  <link rel="stylesheet" type="text/css" href="inc/styles.css" />
 </head>

<body>

<center>

<div class="all">

<div class="header">
    </div>

<div class="left">
     left
    </div>

<div class="right">
     right
    </div>

</div>

</center>

</body>
</html>

################## styles.css #####################

body
{
 background-color:#999999;
 margin:0px;
}

.all
{
 width:800px;
 background-color:#ffffff;
 border:1px solid #000000;
 border-top:0px;
}

.header
{
 width:800px;
 height:120px;
 background-image:url(../img/header.jpg);
}

.left
{
 width:150px;
 border:1px solid #000000;
 float:left;
}

.right
{
 width:640px;
 border:1px solid #000000;
 float:left;

}

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. div elemente plazieren

    Bobby
    – Informationen zu den Bewertungsregeln

    Moin

    Du mußt ein BR nach dem .right - Div einfügen mit der Eigenschaft clear:both und einer Höhe, Zeichengröße und Line-height, margin und padding von 0px.

    Damit erstreckt sich dann der umgebende Div so hoch wie der höchste der beiden innenliegenden Divs.

    Was soll ünbrigens das <center> bewirken? um zu zentrieren gib dem body ein text-align:center und dem .all-Div ein margin-left:auto und margin-right:auto. Ist sauberer

    Gruß Bobby

    --
    -> Für jedes Problem gibt es eine Lösung, die einfach, sauber und falsch ist! <-
    -> Nicht das Problem macht die Schwierigkeiten, sondern unsere Sichtweise! <-
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln