CSS Problem

[glass 10]

Hallo!

 

Ich habe ein Problem mit dem Erstellen einer Webseite. Und zwar mit dem CSS-Layout.

 

WIe es aussehen soll könnt ihr hier sehen. Genau ich möchte das der trenner_middle durchgehend ist und der trenner_links direkt rechts neben dem Bild ist so wie auf dem Beispielbild unten

 

http://nm.cgsolutions-online.de/fileadmin/templates/soll.jpg

 

Mein Script sieht so aus:

 

 

 

*{

margin:0;

padding:0;

}

 

 

 

body{

background:#C4D3E9;

font:.8em "trebuchet ms", arial, sans-serif;

text-align:center;

}

 

#rechts{

position: relative;

float:right;

margin:40px 0px 15px 720px;

width:235px;sx

z-index:5;

}

 

#trenner_links{

background:#97B0D5;

position:relative;

width:180px;

height:100%;

margin:0px 0px 0px 860px;

}

 

#trenner_middle{

background:#4B6EA1;

position:relative;

width:100%;

height:22px;

margin:201px 0px 0px 0px;

}

 

 

#seite{

background:#fff url(hintergrund.jpg) repeat-y;

margin:0 auto;

padding:10px 10px 5px 13px;

text-align:left;

width:775px

}

 

#rootline{

position:relative;

background:#fff;

float:left;

width:500px;

padding:120px 0 4px 0

}

 

 

#oben{

background:#fff url(banner.jpg);

clear:both;

height:150px;

width:700px;

}

 

 

#content{

position: relative;

float:left;

margin:100px 100px 35px 0;

width:458px;

}

 

 

 

#unten{

background:#4B6EA1;

color:white;

clear:both;

width:700px;

}

 

#navigation{

background:#fff;

float:left;

width:500px;

padding:0 0 4px 0

}

 

#navigation ul{

}

 

#navigation ul li{

display:inline;

margin:0 10px 0 0

}

 

#navigation ul li a{

text-decoration:none;

border-bottom:4px solid #fff;

color:#666;

font-size:.9em;

font-weight:bold;

}

 

#navigation ul li a:hover{

text-decoration:none;

border-bottom:4px solid #666

}

 

 

 

 

 

 

 

#content p{

text-align:justify

}

 

#unten p{

color:white;

float:right;

font:.85em "trebuchet ms", verdana, sans-serif;

padding:5px;

}

 

#rechts ul{

list-style:none;

margin:0 0 0 0

}

 

#rechts ul li{

background:url(liste.jpg) no-repeat;

display:block;

margin:0 0px 0 0;

padding:0 0 0 16px

}

 

#rechts ul li a{

text-decoration:none;

color:#666;

}

 

#rechts ul li a:hover{

color:#000;

}

 

 

 

a:link,a:visited,a:active{

color:#000;

text-decoration:underline

}

 

a:hover{

text-decoration:none

}

 

 

#unten a{

color:#fff;

text-decoration:underline

}

 

#unten a:hover{

text-decoration:none

}

 

 

H1 {

font-family : Verdana, sans-serif;

font-size : 16px;

color : #808080;

margin-bottom : 0px;

margin-top : 10px;

}

H2 {

font-family : Verdana, sans-serif;

font-size : 15px;

color : #808080;

margin-bottom : 10px;

margin-top : 20px;

}

H3 {

font-family : Verdana, sans-serif;

font-size : 12px;

color : #808080;

margin-bottom : 0px;

margin-top : 10px;

}

H4 {

font-family : Verdana, sans-serif;

font-size : 10px;

color : #808080;

margin-bottom : 0px;

margin-top : 10px;

}

.subhead1 {

font-family : Verdana, sans-serif;

font-size : 10px;

color : black;

}

.subhead2 {

font-family : Verdana, sans-serif;

font-size : 10px;

color : green;

}

.subhead3 {

font-family : Verdana, sans-serif;

font-size : 10px;

color : red;

}

.headerdate {

font-family : Verdana, sans-serif;

font-size : 10px;

color : red;

font-weight: normal;

}

 

 

strong {

text-decoration: none;

color: black;

}

A { color:black; }

A:hover { color:red; }

A:active { color:red; }

 

 

LG CHRIS

Mit Zitat antworten

[Damian 1.533]

Hi.

 

Hab' den Beitrag mal ins richtige Forum verschoben. :wink2:

 

BTW: der Link funktioniert nicht.

 

Damian

[glass 10]

ok Link funktioniert.

 

Hat jemand eine Idee??

 

Danke

[Mokkujin 10]

Wo liegt denn jetzt genau dein Problem ?

 

Aus deinem Posting werd ich nicht schlau , ich weiß ja nicht wie deine Elemente auf der HP heißen. Das beste wäre du gibst mal einen Link auf die Seite, dann kann ich dir die Lösung vermutlich posten

[glass 10]

Der Link heißt

 

Start

 

LG chris