CSS Problem: Warum ist das rosa?(Stricke original Design um)

Gesperrt
u3hsi
Beiträge: 4
Registriert: Fr 29. Sep 2006, 21:21
Kontaktdaten:
Kontaktdaten von u3hsi

CSS Problem: Warum ist das rosa?(Stricke original Design um)

Beitrag von u3hsi »

Hi,

da ich mich noch nicht so richtig traue und zuwenig zeit habe, ein eigenes Design auf die Beine zu stellen, muss ich das Beispiel-Design umbasteln.

Nun ist durch meinen Umbau dieser hellrosa Streifen zwischen grün und Grau (Also bei dem Übergang von Menü zu Content) entstanden. Hab schon vieles ausprobiert, bekomm ihn aber nicht weg.

Hier die Seite: http://landfrauen-wertherbruch.de/cms/

Meine style.css:

Code: Alles auswählen

html, body { height:100%; }

body {
	padding:0;
	margin:0;
	text-align:left;
	min-width:999px;
	background-color:#FFFFFF;
	font-size:11px;
	font-family:Verdana,Tahoma,Arial,Helvetica,Sans-serif,sans-serif;
	color:rgb(0,0,0);
	background-image:url('../images/bg.gif');
	background-repeat:repeat-y;
	background-position:0px 0px;
	overflow-x:hidden;
	overflow:-moz-scrollbars-vertical;
}

td {
	font-size:11px;
	font-family:Verdana,Tahoma,Arial,Helvetica,Sans-serif,sans-serif;
	color:rgb(62,77,116);
	margin-bottom:8px;
}

.input {
	font-size:11px;
	font-family:Verdana,Tahoma,Arial,Helvetica,Sans-serif,sans-serif;
	color:rgb(0,0,0);
	width:240px;
	margin-bottom:8px;
	border-top:1px solid #999999;
	border-right:1px solid #999999;
	border-bottom:1px solid #999999;
	border-left:1px solid #999999;
}

.label {
	font-size:11px;
	font-family:Verdana,Tahoma,Arial,Helvetica,Sans-serif,sans-serif;
	color:rgb(0,0,0);
}

.small {
	font-size:9px;
}

#outer{
	height:100%;
	min-height:100%;
	width:999px;
	color:#000000;
	text-align:left;
	position:relative;
}
 
html>body #outer{ height:auto; } 

#innerwrap {
	float:left;
	width:700px;
}

#header{
	position:absolute;
	top:0;
	left:-1px;
	width:999px;
	height:103px;
	color:#000000;
	background-color:#ffffff;
	z-index:5; background-repeat:repeat-x
}

#left {
	position:relative;
	width:280px;
	float:left;
	padding-top:120px;
	padding-bottom:20px;
}

#left p { padding-left:3px;padding-right:2px }

#right p { padding-left:4px;padding-right:2px }

#imagecolumn {
	margin-top:0px;
	position:absolute;
	top:20px;
	left:608px;
	width:148px;
	height:550px;
	z-index:10;
	padding-top:112px;
	padding-left:10px;
	padding-right:10px;
	color:rgb(62,77,116);
}

#imagecolumn a {
	padding:0;
	font-weight:normal;
	font-size:11px;
	color:rgb(190,190,190);
	margin:0;
}

#imagecolumn h1 {
	padding:0;
	font-weight:normal;
	font-size:11px;
	color:rgb(217,104,28);
	margin:0;
}

#right {
	position:relative;
	width:270px;
	float:right;
	margin-top:10px;
	padding-top:170px;
	padding-bottom:20px;
	background-color:#999999;
	background:url('../images/randbg.jpg');
	background-position:0px 0px;
	background-repeat:no-repeat;
	color:rgb(62,77,116);
}

div, p  { margin-top:0; }

#centrecontent {
	width:408px;
	float:right;
	padding-left:0px;
	padding-right:0px;
	padding-top:105px;
	padding-bottom:20px;
	color:rgb(62,77,116);
}

#centrecontent p { padding-left:3px:color:rgb(62,77,116); }

#clearfooter { width:100%;height:52px;clear:both; }

#bottomnavi {
	text-align:center;
	color:rgb(210,210,210);
}

#additionalnavi {
	float:right;
	background-color:#ffffff;
	margin-top:3px;
	padding-bottom:2px;
	padding-top:0px;
	margin-left:10px;
	text-align:center;
	width:170px;
	color:rgb(160,160,160);
}

#logo {
	width:999px;
	margin-top:18px;
}

#navipath {
	padding:0;
	padding-bottom:10px;
	color:rgb(99,99,99);
	width:388px;
}

.navi{
	width:200px;
	border-bottom:1px solid rgb(170,170,170);
	background-color:rgb(255,255,255);

}

h1 {
	padding-left:2px;
	font-weight:bold;
	font-size:13px;
	color:rgb(217,104,28);
	margin:0;
}

h1.content {
	margin-bottom:12px;
	padding:0;
}

hr { color:rgb(210,210,210); }

a { font-size:11px; color:rgb(190,190,190); text-decoration:none; }
a:hover { text-decoration:underline; }

a.newsheadline { font-weight:bold; } 

a.bottomnavi { color:rgb(160,160,160); font-size:9px; } 

a.additionalnavi { font-size:10px; color: rgb(160,160,160); }

a.navipath { font-size:10px; color: rgb(160,160,160); } 

a.navileft_passive {
	display:block;
	background-color:#E8E8EE;
	padding-top:3px;
	padding-bottom:3px;
	color:rgb(51,79,119);
} 

a.navileft_active {
	display:block;
	background-color:#ffffff;
	background:url('../images/navi_pfeil_rechts.gif') no-repeat right 50%;
	padding-top:3px;
	padding-bottom:3px;
	color:rgb(51,79,119)
} 

a.navileft_open {
	padding-left:10px;
	display:block;
	background:#E8E8EE url('../images/navi_pfeil.gif') no-repeat right 50%;
	padding-top:3px; padding-bottom:3px; color:rgb(51,79,119); background-color:#E8E8EE
} 

a.sitemap_level1 {
	display:block;
	border-bottom:1px solid #b4a8b4;
	color:rgb(217,104,28);
	font-weight:normal;
	padding-bottom:.4em;
	background:url('../images/navi_pfeil_rechts.gif') no-repeat right 50%;
	
}

a.sitemap_level2 {
	color:rgb(62,77,116);
	background:url('../images/navi_pfeil_rechts.gif') no-repeat 170px 4px;
	display:block
}

a.sitemap_level3 {
	color:rgb(190,190,190);
}

.sitemap_level2_container {
	float:left;
	width:50%;
	padding-top:.3em;
}

.sitemap_level3_container {
	float:right;
	width:50%;
	padding-top:.3em;
}

.input_searchbox {
	width:65px;
	vertical-align:middle;
	font-size:11px;
	color: rgb(62,77,116);
}

.input_newsletterselect {
	width:80px;
	vertical-align:middle;
	font-size:11px;
	margin-right: 8px;
	color: rgb(62,77,116);
}

.label_searchbox {
	vertical-align:middle;
	color:#9d9ea2;
	position:relative;
	padding-left:10px;
	/*left:-65px;*/
}

#loginbox {
	background-color:#DFE0E5;
	border-top:1px solid #aeaeae;
	border-bottom:1px solid #aeaeae;
	padding-bottom:.6em;
	padding-top:.6em;
	padding-left:0em;
	padding-right:0em;
	margin-top:1.5em;
	margin-bottom:1.5em;
}

#searchbox {
	background-color:#DFE0E5;
	border-top:1px solid #aeaeae;
	border-bottom:1px solid #aeaeae;
	padding-bottom:.6em;
	padding-top:.6em;
	padding-left:0em;
	padding-right:0em;
	margin-top:1.5em;
	margin-bottom:1.5em;
}

#newsletterbox {
   background-color:#DFE0E5;
   border-top:1px solid #aeaeae;
   border-bottom:1px solid #aeaeae;
   padding-bottom:.6em;
   padding-top:.6em;
   padding-left:.5em;
   padding-right:.5em;
   margin-top:1.5em;
   margin-bottom:1.5em;
}

.hidden {
	display:none;
}

.balken {
	padding-left:0px;
	background-color:rgb(109,205,51);
	background-repeat: repeat-x,repeat-y;
	background-position:2px 0px ;
}
Mein Layout (Standard):

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<title>Landfrauen Wertherbruch</title>
	<link href="css/style.css" rel="stylesheet" type="text/css">
	<link href="css/style_print.css" rel="stylesheet" type="text/css" media="print">
	<!--[if IE]>
		<style>
			#imagecolumn {
				width:170px;
			}
			#logo {
				margin-top:0;
			}
			#navipath {
				padding-top:2px;
			}
			.balken {
				background-position:0px 0px ;
			}				
			#additionalnavi {
				padding-top:2px;
			}
        </style>
	<![endif]-->
<script language="javascript" type="text/javascript" src="js/jsApi.js"></script>
</head>
<body>
<div id="outer"> 
	<div id="innerwrap"> 
		<div id="centrecontent"> 
			<div id="navipath">
				<container id="60" name="Navigationspfad" types="Navigation" mode="fixed" default="Navigationspfad">Navigationspfad</container>
			</div>
			<container id="10" name="Headline" types="Content" default="Headline (HTML)">Headline (HTML)</container>
			<container id="12" name="Text" types="Content" default="">Content 1</container>
			<container id="15" name="Text" types="Content" default="">Content 2</container>
			<container id="22" name="Text" types="Content" default="">Content 3</container>
			<container id="24" name="Text" types="Content" default="">Content 4</container>
			<container id="26" name="Text" types="Content" default="">Content 5</container>
			<container id="28" name="Text" types="Content" default="">Content 6</container>
			<br/><br/>
			<table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td style="background-color:rgb(210,210,210);"><img src="images/grey.gif" width="1" height="1" border="0" alt="" title=""/></td></tr></table>
			<div id="bottomnavi">
				<container id="30" name="BottomNavigation" types="Navigation" mode="fixed" default="BottomNavigation">BottomNavigation</container>
			</div>			
		</div>
		<div id="left"> 
			<container id="40" name="Hauptnavigation" types="Navigation" mode="fixed" default="Hauptnavigation">Hauptnavigation</container>
			 </div>
	</div>
	<div id="right"></div>
	<div id="clearfooter"></div>
	<div id="header"> 
		<div id="additionalnavi"><container id="50" name="Hilfsnavigation" types="Navigation" mode="fixed" default="Hilfsnavigation">Hilfsnavigation</container></div>
		<div id="logo">
			<table width="999" border="0" cellspacing="0" cellpadding="0">
				<tr>
					<td><a href="front_content.php" title="Zur Homepage"><img src="images/logo.gif" height="61" border="0" alt="Logo" title="Logo"/></a></td>
							</tr>

<tr>
					<td colspan="3" class="balken"><img src="images/blank.gif" border="0" width="999" height="5" alt=""/></td>
				</tr>

							</table>
		</div>
	</div>
</div>
<div id="imagecolumn">
	<container id="70" name="Teaser_Rechts" types="Content" mode="optional">Teaser (Rechts)</container>
	<container id="72" name="Teaser_Rechts" types="Content" mode="optional">Teaser (Rechts)</container>
	<container id="74" name="Teaser_Rechts" types="Content" mode="optional">Teaser (Rechts)</container>
</div>
</body>
</html>
In den Grafiken ist selbstverständlich nichts von diesem hellrosanen. Ich vermute, dass sich da verschiedene Farbtöne überschneiden...
Nach oben
xmurrix
Beiträge: 3215
Registriert: Do 21. Okt 2004, 11:08
Wohnort: Augsburg
Hat sich bedankt: 4 Mal
Danksagung erhalten: 17 Mal
Kontaktdaten:
Kontaktdaten von xmurrix

Beitrag von xmurrix »

Hallo,

der hellrosa Bereich zwischen Navigation und Content ist im Hintergrundbild drin, schau die mal die "/images/bg.gif" genauer an...

Grüße
xmurrix
Nach oben
Gesperrt

Zurück zu „Version 4.6“