2xDIV's skal centreres med float:left
Hej alle sammen.Håber i gider hjælpe selvom der er meget kode!!
Jeg sidder og laver en lille hjemmeside for sjov, og er stødt på et lille problem. Jeg skal have 2 div's til at stå ved siden af hinanden. Det ene div skal der bare være et billede i, og den anden skal der stå text i.
Men når jeg bruger float:left, for at få dem til at være ved siden af hinanden i stedet for under hinanden, så virker margin:auto; ikke til at få dem centreret.
Her er mit html dokument:
<html>
<head><title>Tester side</title></head>
<link rel="stylesheet" type="text/css" href="style.css">
<body class="body">
<div class="divtopbanner"><img class="topbanner" src="images/aloe_vera2.jpg" /></div>
<div class="menutop">Her skal der være en menu</div>
<div class="billedefront"><img class="aloeverastor" src="images/aloeverastor1.jpg" /></div>
<div class="div1">DIV 1 main text skal stå her... </div>
</div>
</body>
</html>
her er mit CSS:
.body {
background-color:#FFFFFF;
text-align:center;
}
.divtopbanner {
width:600;
display:block;
margin:auto;
padding:auto;
margin-bottom:1px;
}
.topbanner {
width:100%;
height:200;
}
.menutop {
background-color:#80FFAA;
border:1px solid;
width:600;
margin:auto;
font-family:verdana;
font-size:14px;
}
.div1 {
background-color:#80FFAA;
width:300;
height:400;
border:1px solid;
margin:auto;
margin-top:1px;
font-family:verdana;
font-size:14px;
float:left;
}
.billedefront {
width:300;
height:400;
border:0px;
margin:auto;
margin-top:1px;
float:left;
}
.aloeverastor {
width:300;
height:400;
border:0px;
margin:auto;
margin-top:1px;
}
Tak :)
