Mit css bin ich noch nicht so Vetraut ich habe sonst immer meine Designs mit Tabelle angepasst. Daher bin ich auch über Tipps sehr dankbar.
html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="include/designs/liga/style.css">
<title>{TITLE}</title>
</head>
<body>
<div id="header"></div>
<div id="partner" align="center">{_boxes_allianz}</div>
<div id="l1"></div>
<div id="menu">
<div id="lmenu"></div>
<div id="navi">
{_boxes_menu}
</div>
<div id="login" align="center">{_boxes_login}</div>
<div id="lmenu"></div>
</div>
<div id="l2"></div>
<div id="page">
<div id="l3"> </div>
<div id="content">
<div id="head_1"></div>
<div>{EXPLODE}</div>
<div id="news_more">{_boxes_lastnews}</div>
</div>
<div id="l4"> </div>
<div id="sidebar">
<div id="head_2"></div>
<div id="match">{_boxes_lastmatch}</div>
<div id="l5"></div>
<div id="head_5"></div>
<div id="tabelle">{_boxes_league}</div>
<div id="l5"></div>
</div>
<div id="l3"> </div>
</div>
<div id="l2"></div>
<div id="unter">
<div id="l3"> </div>
<div style="float:left; width:316px;">
<div id="head_6"></div>
<div id="box_1">{_boxes_lastforum}</div>
</div>
<div id="l3"> </div>
<div style="float:left; width:316px;">
<div id="head_6"></div>
<div id="box_1"></div>
</div>
<div id="l3"> </div>
<div style="float:left; width:316px;">
<div id="head_6"></div>
<div id="box_1"></div>
</div>
<div id="l3"> </div>
</div>
<div id="footer"></div>
</body>
</html>
css
* {
padding: 0;
margin: 0;
}
body {
background-color:#333029;
background-image:url(gfx/bg.gif);
background-position:top;
background-repeat:repeat-x;
font-family:Arial;
font-size:12px;
color:#44413a;
width: 960px;
margin: 0 auto;
}
#header {
height:166px;
width:960px;
}
#partner {
height:166px;
width:960px;
}
#menu {
height:47px;
width:960px;
background-image:url(gfx/menu_bg.png);
}
#navi {
width:785px;
float:left;
}
#login {
width:175px;
height:44px;
float:left;
}
#page {
height:600px;
width:960px;
background-color:#d1cab0;
}
#unter {
height:220px;
width:960px;
float:left;
background-color:#d1cab0;
}
#content {
width:630px;
float:left;
background-color:#d1cab0;
}
#sidebar {
width:320px;
float:left;
}
#news_more {
height:210px;
width:630px;
background-image:url(gfx/news_more_bg.gif);
}
#match {
height:155px;
width:320px;
}
#tabelle {
height:360px;
width:320px;
background-image:url(gfx/tabelle_bg.gif);
}
#box_1 {
height:180px;
width:316px;
background-image:url(gfx/forum_bg.gif);
}
#head_1 {
height:33px;
width:630px;
background-image:url(gfx/news.gif);
}
#head_2 {
height:33px;
width:320px;
background-image:url(gfx/last_match.gif);
}
#head_3 {
height:33px;
width:320px;
background-image:url(gfx/top_lol.gif);
}
#head_4 {
height:33px;
width:320px;
background-image:url(gfx/top_me.gif);
}
#head_5 {
height:33px;
width:320px;
background-image:url(gfx/1_division.gif);
}
#head_6 {
height:33px;
width:316px;
background-image:url(gfx/forum.gif);
}
#head_7 {
height:33px;
width:320px;
background-image:url(gfx/games.gif);
}
#head_8 {
height:33px;
width:320px;
background-image:url(gfx/stream.gif);
}
/**/
/**/
/* class */
/**/
/**/
.login_1{
font-size:11px;
padding-top:5px;
}
.forum_1{
font-size:11px;
color:#dddddd;
text-decoration:none
}
a.forum_1{
font-size:11px;
color:#dddddd;
text-decoration:none
}
a.forum_1:hover{
font-size:11px;
color:#dddddd;
text-decoration:underline;
}
.datum_1{
color:#d1cab0;
font-size:11px;
}
a.news_1{
color:#ffae00;
font-size:11px;
text-decoration:none;
font-weight:bold;
}
.koms_1 {
color:#d1cab0;
font-size:10px;
}
/**/
/**/
/* Lücken */
/**/
/**/
#l1 {
height:17px;
width:960px;
}
#l2 {
height:3px;
width:960px;
background-color:#d1cab0;
}
#l3 {
width:3px;
float:left;
}
#l4 {
width:4px;
float:left;
}
#l5 {
height:3px;
width:320px;
}
#lmenu {
height:5px;
width:960px;
}
/**/
/**/
/* Menu */
/**/
/**/
nav ul ul {
display: none;
}
nav ul li:hover > ul {
display: block;
}
nav ul {
padding: 0 5px;
list-style: none;
position: relative;
display: inline-table;
}
nav ul:after {
content: ""; clear: both; display: block;
}
nav ul li {
float: left;
}
nav ul li:hover {
background: #325068;
}
nav ul li:hover a {
color: #dddddd;
}
nav ul li a {
display: block; padding: 14px 25px;
color: #dddddd; text-decoration: none;
font-size:11px; font-weight:bold;
}
nav ul ul {
border-radius: 0px; padding: 1px 1px;
position: absolute; top: 100%; width:180px;
}
nav ul ul li {
float: none;
position: relative;
}
nav ul ul li a {
padding: 10px 25px;
color: #dddddd;
font-size:10px;
font-weight:bold;
background: #325068;
}
nav ul ul li a:hover {
background: #567893; color:#ffae00;
}
nav ul ul ul {
position: absolute; left: 100%; top:0; width:160px;
border-radius: 0px;
}
/**/
/**/
/* Ilch */
/**/
/**/
.Chead
{
background: #16639b;
color: #9dbdd4;
}
.Chead a
{
color: #9dbdd4;
}
.Chead td, .Chead td strong, .Chead h4, .Chead td b
{
background: #16639b;
color: #9dbdd4;
}
.Callg
{
background-color: #EFEFEF;
color: #000000;
}
.Callg td
{
color: #000000;
}
.Cnorm
{
background-color: #e5e5e5;
}
.Cmite
{
background-color: #B4C6D8;
}
.Cdark
{
background-color: #9AB1C8;
}
.rand
{
border: solid #185685 1px;
}
Zitat geschrieben von Tiborius