Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 17.02.2010, 12:19
Habi Habi ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2010
Beiträge: 4
Habi befindet sich auf einem aufstrebenden Ast
Lächeln 2 CSS Files -> 1 CSS File

Hi
Gleich vorweg: KLASSE Forum ^_^

Ich bin noch im Anfangsstadium also seid lieb *g*

Arbeite zurzeit an einem Layout das mit CSS gemacht wird und möchte dazu eine hübsche CSS Navigation einbinden.
Leider hab ich große Probleme das beide CSS gleichzeitig funktionieren
Ich hoffe es kann mir hier geholfen werden

CSS für index.html
Code:
* { padding: 0; margin: 0; }

body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 13px;
 background: #EAECEC;
}
#wrapper { 
 margin: 0 auto;
 width: 900px;
}
#faux {
 background: #ffffff;
 margin-bottom: 0px;
 overflow: auto; 
 width: 100%
}
#header {
 color: #333;
 width: 900px;
 padding: 0px;
 height: 450px;
 margin: 0px 0px 0px 0px;
 background: #ffffff;
}
#navigation {
 color: #333;
 padding: 0px;
 margin: 0px 0px 0px 0px;
 background: #ffffff;
}
#leftcolumn { 
 display: inline;
 color: #ffffff;
 margin:0px;
 padding:0;
 width: 50px;
 float: left;
}
#content { 
 float: left;
 color: #333;
 margin: 0px 0px;
 padding:0;
 width: 800px;
 display: inline;
 position: relative;
}
#rightcolumn { 
 display: inline;
 position: relative;
 color: #ffffff;
 margin: 0px 0px 0px 0px;
 padding:0;
 width: 50px;
 float: right;
 }
#footer { 
 width: 900px;
 clear: both;
 color: #333;
 background: #ffffff;
 margin: 0px 0px 10px 0px;
 padding: 0px;
}
.clear { clear: both; background: none; }
CSS für die Navigation

Code:
body {
	color: #666;
	}

h1 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:bold;
	margin:0;
	padding:0;
	}

hr {
	border:none;
	border-top:1px solid #CCCCCC;
	height:1px;
	margin-bottom:25px;
	}

a {
	color: #900;
	text-decoration: none;
	}

a:hover {
	background: #900;
	color: #FFF;
	}

/* Root = Horizontal, Secondary = Vertical */
ul#navmenu {
	margin: 0;
	border: 0 none;
	padding: 0;
	width: 500px; /*For KHTML*/
	list-style: none;
	height: 24px;
	}

ul#navmenu li {
	margin: 0;
	border: 0 none;
	padding: 0;
	float: left;
	display: inline;
	list-style: none;
	position: relative;
	height: 24px;
	}

ul#navmenu ul {
	margin: 0;
	border: 0 none;
	padding: 0;
	width: 160px;
	list-style: none;
	display: none;
	position: absolute;
	top: 24px;
	left: 0;
	}

ul#navmenu ul:after /*From IE 7 lack of compliance*/{
	clear: both;
	display: block;
	font: 1px/0px serif;
	content: ".";
	height: 0;
	visibility: hidden;
	}

ul#navmenu ul li {
	width: 160px;
	float: left; /*For IE 7 lack of compliance*/
	display: block !important;
	display: inline; /*For IE*/
	}

/* Root Menu */
ul#navmenu a {
	border: 1px solid #FFF;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
	padding: 0 6px;
	float: none !important; /*For Opera*/
	float: left; /*For IE*/
	display: block;
	background: #EEE;
	color: #666;
	font: bold 10px/22px Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	height: auto !important;
	height: 1%; /*For IE*/
	}

/* Root Menu Hover Persistence */
ul#navmenu a:hover,
ul#navmenu li:hover a,
ul#navmenu li.iehover a {
	background: #CCC;
	color: #FFF;
	}

/* 2nd Menu */
ul#navmenu li:hover li a,
ul#navmenu li.iehover li a {
	float: none;
	background: #EEE;
	color: #666;
	}

/* 2nd Menu Hover Persistence */
ul#navmenu li:hover li a:hover,
ul#navmenu li:hover li:hover a,
ul#navmenu li.iehover li a:hover,
ul#navmenu li.iehover li.iehover a {
	background: #CCC;
	color: #FFF;
	}

/* 3rd Menu */
ul#navmenu li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li a {
	background: #EEE;
	color: #666;
	}

/* 3rd Menu Hover Persistence */
ul#navmenu li:hover li:hover li a:hover,
ul#navmenu li:hover li:hover li:hover a,
ul#navmenu li.iehover li.iehover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover a {
	background: #CCC;
	color: #FFF;
	}

/* 4th Menu */
ul#navmenu li:hover li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li.iehover li a {
	background: #EEE;
	color: #666;
	}

/* 4th Menu Hover */
ul#navmenu li:hover li:hover li:hover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover li a:hover {
	background: #CCC;
	color: #FFF;
	}

ul#navmenu ul ul,
ul#navmenu ul ul ul {
	display: none;
	position: absolute;
	top: 0;
	left: 160px;
	}

/* Do Not Move - Must Come Before display:block*/
ul#navmenu li:hover ul ul,
ul#navmenu li:hover ul ul ul,
ul#navmenu li.iehover ul ul,
ul#navmenu li.iehover ul ul ul {
	display: none;
	}

ul#navmenu li:hover ul,
ul#navmenu ul li:hover ul,
ul#navmenu ul ul li:hover ul,
ul#navmenu li.iehover ul,
ul#navmenu ul li.iehover ul,
ul#navmenu ul ul li.iehover ul {
	display: block;
	}
Ich schaffs einfach nicht die 2 zusammenzuwürfeln


Soll ich die .html codes auch zeigen?

Liebe Grüße,
Habi
Mit Zitat antworten
Sponsored Links