Witam,
Potrzebuję następującego układu divów:
(IMG:
http://dl.dropbox.com/u/65026652/jakbymchcial.jpg)
Jednak wszelkie divy które umieszczam (te niebieskie) ustawiają się 4 piksele na lewo od ostatniego (po prawej) żółtego diva, o tak:
(IMG:
http://dl.dropbox.com/u/65026652/jakjest.jpg)
Te niebieskie divy próbowałem wsadzić do jednego dużego i tam pozycjonować, ale one i tak ustawiają się do tego żółtego diva. Co jest nie tak, jak powinienem to zrobić? Kod html i css:
<!DOCTYPE html>
<meta name="Author" content="Blabla"> <link rel="Stylesheet" href="style/css3.css">
<!-- ------------------------------------------------------------------- -->
<header id="top">
<nav id="top">
<img id="avatar" src="images/avatartest.jpg" /> <h1>Janusz Korwin-Mikke
</h1> <p id="top">edytuj profil
</p> 0 nowych prywantych wiadomości
<br/> 0 zaplanowanych zdarzeń na jutro
<br/> <span style="font-family:Tahoma; font-size:8pt; color:white; font-weight:bold;">2 nowe wiadomości e-mail
</span><span style="font-family:Tahoma; font-size:8pt; color:red; font-weight:bold;">*
</span>
</nav>
</header>
<!-- ------------------------------------------------------------------- -->
<section id="left">s
</section>
<!-- ------------------------------------------------------------------- -->
<section id="center">a
</section>
<!-- ------------------------------------------------------------------- -->
<section id="right">v
</section>
<!-- ------------------------------------------------------------------- -->
<footer>
</footer>
<!-- ------------------------------------------------------------------- -->
@charset "utf-8";
body {margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:0px; background-image:url(../images/background.jpg); background-repeat:repeat-x; background-color:#f1f2e8;}
header#top {margin-left:auto; margin-right:auto; margin-top:0px; margin-bottom:0px; height:84px; width: 980px; background-image:url(../images/logotyp.jpg); background-repeat:no-repeat; }
nav#top { margin-left:auto; margin-right:auto; margin-top:0px; margin-bottom:0px; height:84px; width:430px; background-image:url(../images/sep.jpg),url(../images/backgroundtopnav.jpg);,url(../images/sepr.jpg); background-position:left,left,right; background-repeat:no-repeat,repeat-x,no-repeat; }
div#top { margin-left:4px; margin-right:0px; margin-top:0px; margin-bottom:0px; height:84px; width:93px; background-image:url(../images/backgroundavatar.jpg); background-repeat:no-repeat; float:left;}
div#c { margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:0px; height:84px; width:140px; float:left; text-align:center; padding-top:25px; }
div#r { margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:0px; height:84px; width:181px; float:left; text-align:left; padding-top:22px; padding-left:8px; }
div#sepr { margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:0px; height:84px; width:4px; float:left; background-image:url(../images/sepr.jpg); }
h1 { font-family:Tahoma; font-size:10pt; font-weight:bold; color:white; margin-top:0px; padding-bottom:0px; margin-bottom:0px; padding-top:0px; }
p#top { font-family:Tahoma; font-size:8pt; color:#bddde9; padding-top:0px; margin-top:0px; }
img#avatar { margin-top:17px; margin-left:21px; }
section#all { width:980px; height:530px; background-color:black; margin-top:0px; padding-top:0px; padding-right:0px; margin-left:auto; margin-right:auto; }
section#left { width:50px; height:50px; float:left; background-color:blue; position:absolute; left: 20px; top: 30px; }
section#center { width:300px; height:530px; float:left; background-color:red; }
section#right { width:100px; height:530px; float:left; background-color:green; }