PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : richtig floaten



_SlayeR_
08.03.2010, 08:49
Hallo,
ich habe versucht ein 3 spalten layout zu machen, bekomme es aber nicht richtig gefloatet. Kann mal wer bitte drüber schauen.
In jeden Tutorial wirds anders gemacht.
Hier meine Seite

http://dannybdanny.da.funpic.de
update* content ist jetzt margin:0 auto; aber das problem besteht ja noch immer



<div id="all">

<div id="navileft">
<ul>
<li><a href="#">Navi1</a></li>
<li><a href="#">Navi1</a></li>
<li><a href="#">Navi1</a></li>
</ul>
</div><!--END LEFTCOL-->

<div id="content">
</div><!--END CENTERCOL-->

<div id="naviright">
<li><a href="#">Navi1</a></li>
<li><a href="#">Navi1</a></li>
<li><a href="#">Navi1</a></li>
</div><!--END RIGHTCOL-->


</div>


/* CSS Document */
* {
margin:0;
padding:0;
}
body {
margin:0;
padding:0;
font-family:Tahoma;
font-size:12px;
text-align:center;
background:#666666;
}

#all {
margin:30px auto;
width:900px;
}

#navileft {
width:150px;
float:left;
}
#naviright {
width:150px;
float:right;
}
#content {
width:600px;
margin:0 150px;
height:600px;
background:#999999;
}
#navileft a, #naviright a {
display:block;
line-height:20px;
text-align:center;
text-decoration:none;
margin-bottom:10px;
background:#CCCCCC;
border:1px solid #000000;
color:#000000;
}
#navileft li, #naviright li {
list-style-type:none;
}
#navileft a:hover, #naviright a:hover {
background:#00CCFF;
font-size:14px;
}

trixx3r
08.03.2010, 09:23
ich glaub du willst das so :)



<div id="navileft">
<ul>
<li><a href="#">Navi1</a></li>
<li><a href="#">Navi1</a></li>
<li><a href="#">Navi1</a></li>
</ul>
</div><!--END LEFTCOL-->

<div id="naviright">
<li><a href="#">Navi1</a></li>
<li><a href="#">Navi1</a></li>
<li><a href="#">Navi1</a></li>
</div><!--END RIGHTCOL-->

<div id="content"></div><!--END CENTERCOL-->





@charset "utf-8";
/* CSS Document */
* {
margin:0;
padding:0;
}

body {
margin:auto;
padding:0;
font-family:Tahoma;
font-size:12px;
text-align:center;
background:#666666;
width:900px;
height:autopx;
}

#navileft {
width:150px;
float:left;
}
#naviright {
width:150px;
float:right;
}
#content {
width:600px;
margin:0 150px;
height:600px;
background:#999999;
}
#navileft a, #naviright a {
display:block;
line-height:20px;
text-align:center;
text-decoration:none;
margin-bottom:10px;
background:#CCCCCC;
border:1px solid #000000;
color:#000000;
}
#navileft li, #naviright li {
list-style-type:none;
}
#navileft a:hover, #naviright a:hover {
background:#00CCFF;
font-size:14px;
}

_SlayeR_
08.03.2010, 09:33
Danke hat geklappt .. einfach content unter navirechts...
so ein schmarn,.. in dreamweaver wird auch alles falsch dargestellt.. auch wenns richtig ist^^

trixx3r
08.03.2010, 09:36
;) also bei mir wird es richtig (dreamweaver) angezeigt muss zwar ab und zu f5 drücken aber passt schon xD

_SlayeR_
08.03.2010, 09:50
http://dannybdanny.da.funpic.de/Unbenannt.JPG


Danke trotzdem, jetzt weiß ich dass es klappt ;)