Alright well i started creating a local website for my self and i wanted to have 3 columns
1st column on the left to be a menu,2nd column to be the main content of the website and the 3rd column(as big as the first one) for extras.
now i’ve managed to get the 1st and the 2nd together but the third one won’t come next to the 2nd one, it stays under it -.-
heres the code for it all:
<html>
<head>
<title>Imad Nowsharis football page</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="header">
<p>Hello world!</p>
<a href="http://www.fussballdaten.de" target="new"><img src="bayern2.gif" border="0" title="BayernLogo"></a>
<br />
</div>
<div class="menu">
<p>menu</p>
<ol>
<li><a href="http://www.fussball-web-shop.de/shop/index.php?lang=DEU&list=BAYERN-M%DCNCHEN%20FANAR" target="new">To WebShop</a></li>
<li><a href="http://www.fcbayern.telekom.de/de/mannschaften/profis/index.php?fcb_sid=1a702b8c99685e679715a05c4fb001ea" target="new">Team</a></li>
</ol>
</div>
<!--
<div class="abstand">
<p> </p>
</div>
-->
<div class="content">
<h3>Spiele Highlights</h3>
<table border="0" cellpadding="0" cellspacing="10">
<tr>
<td><a href="http://www.youtube.com/watch?v=tDraYtESG9w" target="new"><img src="bayerngame.jpg" border="0" title="Bayern Gegen Mainz"></a><br />
Bayern Gegen Mainz 19.02.11 Spielstand: 3-1 </td>
<td><p> </p></td>
<td><a href="http://www.youtube.com/watch?v=X9RithjlRqw" target="new"><img src="bayernhoff.jpg" border="0" title="Bayern Gegen Hoffenheim"></a><br />
Bayern Gegen Hoffenheim 12.02.11 Spielstand: 4-0 </td>
</tr>
<tr>
<td><a href="http://www.youtube.com/watch?v=4kfk3YU5yls" target="new"><img src="inter.jpg" border="0" title="Bayern Gegen Inter"></a><br />
Baynern Gegen Inter CL finale 22.05.10 Spielstand: 0-2 </td>
<p> </p>
<td><p> </p></td>
<td><a href="http://www.youtube.com/watch?v=Ho3ycSxhofg" target="new"><img src="juventus.jpg" border="0" title="Bayern Gegen Juventus"></a><br />
Bayern Gegen Juventus 9.12.09 Spielstand: 4-1 </td>
</tr>
<tr>
<td><a href="http://www.youtube.com/watch?v=zldvn4XyhiU&feature=related" target="new"><img src="manu.jpg" border="0" title="Bayern Gegen ManchesterUnited"></a><br />
Bayern Gegen Manchester United CL 30.03.10 Spielstand: 2-1 </td>
<td><p> </p></td>
<td><a href="http://www.youtube.com/watch?v=krn-NgChMlM&feature=related" target="new"><img src="vfl.jpg" border="0" title="Bayern Gegen Bochum"></a>
Bayern Gegen Bochum 12.12.09 Spielstand: 5-1 </td>
</tr>
</table>
<p>content</p>
</div>
<div class="extras">
<table><h3>Tabelle</h3></table>
<table border="1" cellpadding="0" cellspacing="0">
<tr>
<td><a href="http://www.bvb.de" target="new">1.Dortmund</a></p></td>
<td><p>55</p></td>
</tr>
<tr>
<td><a href="http://www.bayer04.de" target="new">2.Leverkusen</a></p></td></td>
<td><p>45</p></td>
</tr>
<tr>
<td><p><a href="http://www.fcbayern.telekom.de" target="new">3.München</a></p></td>
<td><p>42</p></td>
</tr>
<tr>
<td><p><a href="http://www.hsc-hannover.de/" target="new">4.Hannover</a></p></td>
<td><p>41</p></td>
</tr>
</tr>
<tr>
<td><p><a href="http://www.mainz05.de/" target="new">5.Mainz</a></p></td>
<td><p>37</p></td>
</tr>
</tr>
<tr>
<td><p><a href="http://www.scfreiburg.com/" target="new">6.Freiburg</a></p></td>
<td><p>37</p></td>
</tr>
</tr>
<tr>
<td><p><a href="http://www.hsv.de" target="new">7.HSV</a></p></td>
<td><p>36</p></td>
</tr>
</tr>
</tr>
<tr>
<td><p><a href="http://www.fcn.de/" target="new">8.FC Nürnberg</a></p></td>
<td><p>35</p></td>
</tr>
<tr>
<td><p><a href="http://www.achtzehn99.de/" target="new">9.Hoffenheim</a></p></td>
<td><p>33</p></td>
</tr>
</tr>
<tr>
<td><p><a href="http://www.schalke04.de" target="new">10.Schalke 04</a></p></td>
<td><p>29</p></td>
</tr> </tr>
<tr>
<td><p><a href="http://www.fcstpauli.com" target="new">11.St. Pauli</a></p></td>
<td><p>28</p></td>
</tr>
</table>
<br />
</div>
</body>
</html>
CSS style:
body {
background-color:#1b7b7c;
}
p {
color:#ffffff;
font-family:verdana, arial;
font-size:12px;
line-height:100%;
}
div.header {
margin:20px 0 0 20px;
padding:20px 0 0 20px;
border:1px;
border-style:solid;
border-color:#ff0000;
width:800px;
height:100px;
}
div.menu {
margin:20px 0 0 20px;
padding:20px 0 0 20px;
border:1px;
border-style:solid;
border-color:#ff00ff;
width:150px;
height:300px;
float:left;
}
div.abstand {
margin:20px 0 0 20px;
padding:20px 0 0 20px;
border:1px;
border-style:solid;
border-color:#ff00f0;
width:10px;
height:300px;
float:left;
}
div.content {
margin:20px 0 0 200px;
padding:20px 0 0 20px;
border:1px;
border-style:solid;
border-color:red;
width:480px;
height:600px;
}
div.extras {
font-family:arial;
font-size:12px;
margin:20px 0 0 690px;
padding:20px 0 0 20px;
border:1px;
border-style:solid;
border-color:blue;
width:110px;
height:300px;
}
div.footer {
}
td {
color:white;
font-family:arial,verdana;
font-size:12px;
}
a {
color:white;
text-decoration:none;
}
Thanks for the help
Uhmad