H
Hiobifi
Guest
Abend Leute
Also ich komm gleich zur Sache. Ich bin gerade dabei eine Minimal-Website zu schreiben für nen Clan in Trackmania. Klappt auch ganz gut, will alles so einfach wie möglich halten nur grundlegende Informationen, also nichts mit PHP, JS und so weiter. Reines HTML und CSS. Nun zum Problem: Ich würde gerne eine Tabelle in einen DIV-Bereich einfügen. Aber wenn ich mir das ganze dann in Firefox anschaue ist die Tabelle rechts neben der Stelle wo ich sie eigentlich haben wollte. Bin den ganzen Code mehrmals durchgegangen, konnte aber keine Fehler entdecken. Google war in diesem Fall beeindruckend unhilfreich. Könnt ihr mir vll helfen? Danke schon mal im Vorraus
Oben der HTML Teil und unten der CSS Teil
Also ich komm gleich zur Sache. Ich bin gerade dabei eine Minimal-Website zu schreiben für nen Clan in Trackmania. Klappt auch ganz gut, will alles so einfach wie möglich halten nur grundlegende Informationen, also nichts mit PHP, JS und so weiter. Reines HTML und CSS. Nun zum Problem: Ich würde gerne eine Tabelle in einen DIV-Bereich einfügen. Aber wenn ich mir das ganze dann in Firefox anschaue ist die Tabelle rechts neben der Stelle wo ich sie eigentlich haben wollte. Bin den ganzen Code mehrmals durchgegangen, konnte aber keine Fehler entdecken. Google war in diesem Fall beeindruckend unhilfreich. Könnt ihr mir vll helfen? Danke schon mal im Vorraus
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
@import url(mitglieder.css);
</style>
</head>
<body>
<div id="header"></div>
<div id="container">
<div id="nav">
<ul class="menu">
<li><a href="index.html" class="normal">Home</a></li>
<li><a href="news.html" class="normal">News</a></li>
<li><a href="mitglieder.html" class="aktive">Mitglieder</a></li>
<li><a href="clanregeln.html" class="normal">Der Clan</a></li>
<li><a href="impressum.html" class="normal">Impressum</a></li>
</ul>
</div>
<div id="content">
<table>
<thead>
<tr><th>Mitglied</th><th>Nation</th><th>Lieblingsserver</th><th>Mitgleid seit</th><th>Ausgetreten am</th></tr>
</thead>
<tbody>
<tr><td>Hiobifi</td><td>Germany</td><td>cos||Fullspeed</td><td>Anfang (Gründer)</td><td>---</td></tr>
</tbody>
<tfoot>
<tr><th></th><th></th><th></th><th></th><th></th></tr>
</tfoot>
</table>
</div>
<div id="footer"></div>
</div>
</body>
</html>
Code:
/*---Layout-----------------------------------------------------------------*/
body, html {
margin: 0px;
padding: 0px;
background: #444;
font-family: Arial Black;
font-size: 14pt;
}
#header {
width: 100%;
margin: 0px;
padding: 0px;
height: 203px;
background: #000;
border-bottom: 3px solid #0ff;
}
#container {
width: 1000px;
margin: 0px;
margin: 0 auto;
padding: 0px;
}
#nav {
width: 1000px;
margin: 0px;
padding: 0px;
margin-top: -63px;
}
#content {
max-width: 1000px;
background: white;
margin: 0px;
padding: 0px;
}
#footer {
width: 1000px;
height: 40px;
background: #111;
margin: 0px;
padding: 0px;
}
/*---Navigation-------------------------------------------------------------*/
ul {
list-style-type: none;
margin: 0px;
padding: 0px;
}
ul.menu li a.normal {
float: left;
width: 200px;
background: #111;
font-size: 16px;
font-weight: bold;
text-align: center;
padding-top: 19px;
padding-bottom: 18px;
color: white;
text-decoration: none;
border-bottom: 3px solid #0ff;
}
ul.menu li a.normal:hover {
float: left;
width: 200px;
background: #222;
font-size: 16px;
font-weight: bold;
text-align: center;
padding-top: 19px;
padding-bottom: 18px;
color: #0ff;
text-decoration: none;
border-bottom: 3px solid #0ff;
}
ul.menu li a.aktive {
float: left;
width: 200px;
background: white;
font-size: 16px;
font-weight: bold;
text-align: center;
padding-top: 16px;
padding-bottom: 18px;
color: #0ff;
text-decoration: none;
border-top: 3px solid #0ff;
}
/*---Tabellen---------------------------------------------------------------*/
table {
border-collapse: collapse;
margin: 0 auto;
width: 990px;
font-family: Verdana;
font-weight: normal;
}
thead, tfoot {
height: 40px;
background: #111;
color: white;
}
td {
background: #eee;
height: 40px;
text-align: center;
}