Untermenüs über css ansprechen

**meson** · 02.01.2011 17:47

Hallo!

ich habe ein vorhandenes Template so umgestaltet, dass es mir fast gefällt. Das einzige was ich ändern möchte und nicht schaffe sind die Untermenüs. Unten die vorhandene CSS. Hier die Website um die es geht: www.shaolintempel.at/steyr

Die Aufzählungspunkte und den Abstand habe ich so als Titel für die Menüs eingegeben. Ich habs nicht geschaft die Untermenüs getrennt vom Hauptmenü über die css anzusprechen. Hoffe ihr könnt mir helfen.

lg
Oliver

Code:

body {

	text-align: center; /* required for centering the page in IE */

	margin: 0px;

	padding: 0px;

	background-image: url(../images/cp_bg.png);

	background-repeat: repeat-x;

	font-family: Arial, sans-serif;

	font-size: 12px;

	color: #990000;

	line-height:20px;

	background-color: #222222;

}



h1, h2, h3, h4, p, ul, li {

	margin: 0px;

	padding: 0px;

	font: 12px Arial,sans-serif;

}



h1,h2,h3,.componentheading, .contentheading {

	font: normal normal 200% "Trebuchet MS",Arial,sans-serif;

	font-weight:bold;color: #990000;

}



h2 {

	font-size:160%

}



h3 {

	font-size:120%

}



html, body {

	height: 100%;

	width: 100%;

}

	

a:link ,  a:visited{

	text-decoration: underline;

	color: #990000;

	font-weight: bold;

}



a:hover {

	text-decoration: none;

	color: #550000;

	font-weight: bold;

}



#wrapper {

	position:static;

	width: 877px;

	margin: 0 auto; /* centering the page */

	text-align: left;

}



#header {

	position:static;

	height: 117px;

	background-image:url(../images/head.png)

}



#Menu{

	position:static;

	background-image:url(../images/menu.png);

	width: 877px;

	height:148px;

}



#container {

	background-image:url(../images/body.png);

	background-repeat: repeat-y;

}

	

#innerContainer {

	margin-right: 12px;

	margin-left: 12px;

	height:100%;



}

.bs_contentdiv {



	}

#FlashHeadpiece {

text-align:center;





	margin-left:auto;

	margin-right:auto;

	background-color:#000000;

	border-bottom-width: 1px;

	border-top-style: solid;

	border-right-style: solid;

	border-bottom-style: solid;

	border-left-style: solid;

	border-top-color: #CCCCCC;

	border-right-color: #CCCCCC;

	border-bottom-color: #333333;

	border-left-color: #CCCCCC;

	border-top-width: 0px;

	border-right-width: 0px;

	border-left-width: 0px;

}



#left {

	float: left;

	width: 166px;

	position:relative;

}

	

#leftInner {

	font: 90% Arial,sans-serif;

	padding-left: 8px;

}



.latestnews, .mostread, .popular {

	font: 11px Arial,sans-serif;

	list-style-type:none;

}



ul.mostread, ul.latestnews {

	list-style: none;

	margin-left: 0;

	padding-left: 1.5em;

	text-indent: -1.3em;

	}

li.mostread, li.latestnews {

	padding-bottom:4px;

	list-style-type:none;



}



li.mostread a:link, li.latestnews a:link {

	padding-left: 14px;

	background-image: url(../images/starbullet.png);

	background-repeat: no-repeat;

	background-position: left 2px;

}



li.mostread a:hover, li.latestnews a:hover {

	background-image: url(../images/starbullet-hover.png);

	background-repeat: no-repeat;

	background-position: left 2px;

}



#content {

	width: 638px;

	float:right;

	padding-top: 5px;

	padding-right: 30px;

	padding-bottom: 15px;

	padding-left: 14px;

}

	

#content p {

	line-height:20px;

	font: 12px;

}

	

#content ul{

	list-style-type: none;

}

	

#content li{

	line-height:20px;

	font-size: 12px;

	padding-left:14px;

	background-image: url(../images/bluearrowbullet.png);

	background-repeat: no-repeat;

	background-position: left 4px;

}



#clear {

	height: 0px;

	clear:both;	

}

	

.clear {

    clear: both;

    display: block;

    height: 1px;

    overflow: hidden;

    margin: 0;

    padding: 0;

}



#footer {

	height: 50px;

	clear:both;

	text-align:center;

	background-image:url(../images/footer.png)

}

		/*Horizontal Nav*/

		

#nav {

	float: right;

}



div#nav,div#nav li{

	list-style-type:none;

	margin:0;

}



div#nav{

	position:static;

	margin-right: 36px;

	font-size: 12px;

}



div#nav li{

	float:left;

	margin-right: 1px;

	font-size: 12px;

	text-align: center;

	display: inline;

	vertical-align: middle;

}



div#nav a{

	float:left;

	height: 26px;

	line-height: 26px;

	text-decoration:none;	

	color: #FFF;

	font-weight: bold;

	padding-left:15px;

	padding-right:15px;

}



div#nav a:hover {

	color: #fff;

	background-repeat: repeat-x;

	background-position: 0px;

	background-image: url(../images/buttonhover.png);

	background-color: #3399CC;

}



div#nav li.activelink a,div#nav li.activelink a:hover{

	color: #fff;

	background-image: url(../images/buttonhover.png);

	background-color: #3399CC;

}



#nav a:link#active_menu-nav, #nav a:visited#active_menu-nav{

	color: #fff;

	background-image: url(../images/buttonhover.png);

	background-color: #3399CC;

}

	

	

	/*Vertical Nav*/

	

	

.module_menu, #left .module {

	width: 160px;

	list-style-type: none;

	text-indent: 5px;

}


ul.menu, #form-login ul {

	margin-left: 0;

	padding-left: 0;

	list-style-type: none;

	font-family: Arial, Helvetica, sans-serif;

}



ul.menu a, #form-login a {

	display: block;

	padding: 3px;

	width: 160px;

	border-bottom: 0px solid #333333;

	color: #ffffff;

font-size: 13px;

	text-decoration: none;

}



a.mainlevel a:link,  a.mainlevel a:visited {

	color: #000000;

	text-decoration: none;

	font-weight: bold;

	background-image:url(../images/vertnavbutton.png);

	background-repeat:repeat-x;

}

ul.menu333 a:link,  ul.menu333 a:visited {

	color: #000000;

	text-decoration: none;

	font-weight: bold;

	background-image:url(../images/vertnavbutton.png);

	background-repeat:repeat-x;

}



ul.menu a:hover,  #form-login a:hover {

	color: #ffcc00;

	background-image:url(../images/vertnavbutton-hover.png);

	background-repeat:repeat-x;

}



ul.menu  .active a{

	color: #ffcc00;

        
	background-image:url(../images/vertnavbutton-hover.png);

	background-repeat: repeat-x;
        
}

ul.menu  .active ul{

	color: #222222;

        margin-left: 0px;
        padding-right: 0px;
	

}

ul.menu  .active a:hover{

	color: #ffcc00;


	background-image:url(../images/vertnavbutton.png);

	background-repeat:repeat-x;

}







.componentheading {

	font-family: "Trebuchet MS",Tahoma, Verdana, Arial;

	font-size: 20px;

	font-weight: bold;

	color: #990000;

	padding-top: 5px;

	padding-bottom:10px;

}



.contentheading {

	font-family: "Trebuchet MS".Tahoma, Verdana, Arial;

	font-size: 20px;

	font-weight: bold;

	color: #990000;



}



#leftInner .moduletable {

	padding-bottom:5px;

}



.search {

	padding-top:10px;

	padding-bottom:5px;

}



h3 {

	font-family: "Trebuchet MS",Tahoma, Verdana, Arial;

	font-size: 18px;

	font-weight: bold;

	color: #990000;

	padding-top: 5px;

	padding-bottom:5px;

}



h2 {

	font-family: "Trebuchet MS",Tahoma, Verdana, Arial;

	font-size: 20px;

	font-weight: bold;

	color: #990000;

	padding-top: 5px;

	padding-bottom:5px;

}



#mod_login_password, #mod_login_username, #mod_search_searchword {

	width:145px;

	color: #FFF;

}



form {

	margin: 0;

	padding: 0;

}



input, select {

	font: 12px "Lucida Grande",	 Arial,sans-serif;

}



select, .inputbox {

	padding: 2px;

}



textarea {

	padding-left: 2px;

}



.button {

	border: 1px solid #2F2F2F;

	padding: 1px 10px!important;

	padding: 1px 5px;

	background: url(../images/button-bg.gif)!important repeat-x top #333;

	color: #FFFFFF;

}



.button:hover  {

	background: url(../images/button-bg.gif) repeat-x top #66B5FF;

	color: #fff;

}



.button:active, .button:focus {

	border: 1px solid #222222;

}



.buttonheading img, .hasTip img, .bs_contentdiv img {

	border: 0px;

}



.inputbox {

	border: 1px solid #3F3F3F;

	background: #2F2F2F;

	color: #FFFFFF;

	margin-left:5px;

}

	

.inputbox:hover, .inputbox:focus {

	border: 1px solid #606060;

}



fieldset.js_loginflat {

	border:0px;

	padding:8px;

	margin-left:12px;

	margin-right:12px;

	font: 11px Arial,sans-serif;

	text-align:center;

	vertical-align:top;

}



fieldset.js_loginflat .inputbox {

	width:145px;

}



fieldset.js_loginflat legend {

	display:none

}



.moduletableflat {

	text-align:center;

	vertical-align:top;

}



.bearright {

	top:25px;

	right:15px;

	position:absolute;

}







.line {

	color: #CCCCCC;

}



#colorfield-border {

	float:left;

	position:relative;

	top:158px;

	left:138px;

}



#colorfield-link {

	float:left;

	position:relative;

	top:180px;

	left:76px;

}



a.divlink, a.divlink:link, a.divlink:visited  {

	display:block;

	width:100%; /*width needs to be specified to work in IE*/

	height:100%; /*height needs to be specified to work in IE*/

	/*Other browsers expand the link to full width and height.*/

	line-height:0px;

	font-size:0px;

	color: #222222;

}



fieldset.input {

border:none;



}

input.button {

margin-left:10px;



}



#form-login-password, #form-login-username {



}

.small, .createdate {

font-size:90%;

font-style:italic;

}

**Lacki** · 02.01.2011 17:59

Ungefähr so:

HTML-Code:

ul.menu li ul 
{
}
ul.menu li ul li 
{
}
ul.menu li ul li a 
{
}
ul.menu li ul li a span
{
}

z. B. Texteinzug für die Unterpunkte:

Code:

ul.menu li ul li 
{
text-indent:18px;
}

Dann kannst Du Deine vielen Leerzeichen auch entfernen

**meson** · 02.01.2011 19:03

Danke! So lang suchen und dann so einfach.

**Harmageddon** · 02.01.2011 21:40

Wenn dein Problem gelöst ist, dann markiere das Thema doch bitte noch als gelöst wie in meiner Signatur beschrieben. Danke!

Thema: Untermenüs über css ansprechen

LinkBack

Themen-Optionen

Thema durchsuchen

Anzeige

Untermenüs über css ansprechen

Erhielt Danksagungen von:

Erhielt Danksagungen von:

Lesezeichen

Lesezeichen

Berechtigungen