css für submenü

Roxxinger
Autor
Neues Mitglied

Mehr

27 Feb. 2008 12:02 #12252 von Roxxinger

css für submenü wurde erstellt von Roxxinger

hi

vllt kann mir ja jemand helfen

ich bin gerade dabei ein template anzupassen und finde irgendwie nicht wie ich die 2te ebene eines subemnüs anspreche per css
--ALTER LINK WURDE ENTFERNT--
da kann man sich das mal angucken, bei dem menüpunkt touren, die erstesubebne und die 2te sollte sich genau so verhalten wie das hauptmenü und auch nicht soweit eingerückt sein, wei bekomme ich das hin?

hier mal die template.css

Code:

html {
  height: 100%;
  margin-bottom: 0px;
}

form {
  margin: 0;
  padding: 0;
}

img,table {
	border: none;
}

body {
	font-family: Georgia, "Trebuchet MS", sans-serif;
	line-height: 1.3em;
	margin: 0;
	padding: 0;
	font-size: 12px;
	color: #2c1a00;
}

a:link, a:visited {
	text-decoration: underline;
	font-size: 12px;
	color: #726d6a;
}

a:hover {
	text-decoration: none;
	font-weight: normal;
	color: #FF7A00;
}

input.button, .validate  {
	color: #666;
	background: #f1f1f1;
	border: 1px solid #999;
	font-size: 1.0em;
}

input.button:hover, .validate:hover  {
	background: #f9f9f9;
}

p {
  margin-top: 0;
  margin-bottom: 5px;
}

/*****************************************/
/*** Template specific layout elements ***/
/*****************************************/
div.center {
	text-align: center;
	margin: 0 auto;
	background: #f3f2e7 url(../images/page_bg.jpg) top center repeat-y;
}

div#wrapper {
	margin: 0 auto;
	width: 770px;
	text-align: left;
}

#logo {
	padding: 0px 0 0 520px;
	height: 55px;
	text-align: center;
}

#logo a, #logo a:link, #logo a:hover {
	font-weight: normal;
	font-family: Arial, "Trebuchet MS", sans-serif;
	font-size: 28px;
	padding: 0 ;
	margin: 0;
	line-height: 1.4em;
	letter-spacing: 1px;
	color: #000000;
	background: transparent;
	text-decoration: none;
	outline: none;
}

div#newsflash {
	width: auto;
	margin-left: 350px;
	margin-right: 30px;
	border: 1px solid #00f;
}

#pathway {
	width: 870px;
	height: 40px;
	margin: 0 auto;
	text-align: left;
	background: url(../images/path.jpg) top center no-repeat;
}

span.pathway {
	color: #2c1a00;
	display: block;
	padding: 18px 0 0 50px;
	font-size: 12px;
	overflow: hidden;
}

span a.pathway  {
	text-decoration: underline;
	color: #2c1a00;
}

#search {
	float: right;
	width:320px;
	margin-top: -20px;
	margin-right: 20px;
	height: 40px;
	overflow: hidden;
	text-align: right;
}

#area {
	padding: 0;
	margin: 0;
}

#leftcolumn ,#rightcolumn {
	margin: 0;
	width: 180px;
	float: left;
	padding: 0;
	text-align: left;
border: 1px dashed #FF7A00;
}

div#maincolumn {
	padding: 0 0 0 20px;
	float: left;
	width: 550px;
}
div#maincolumn_full {
	margin: 0 10px;
	width: 770px;
	}

div.nopad {
	padding: 5px 0 0 0;
}

div.nopad ul {
	clear: both;
}

td.middle_pad {
	width: 20px;
}

/*****************************************/
/*** Joomla! specific content elements ***/
/*****************************************/

div.offline {
	background: #fffebb;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	font-size: 1.2em;
	padding: 5px;
}

/* headers */
div.componentheading {
	padding-left: 0px;
}

h1 {
	padding: 0;
	font-family: Georgia, "Trebuchet MS", sans-serif;
	font-size: 1.3em;
	font-weight: bold;
	vertical-align: bottom;
	color: #666;
	text-align: left;
	width: 100%;
}

h2, .contentheading {
	padding: 0;
	font-family: Georgia, "Trebuchet MS", sans-serif;
	font-size: 12px;
	font-weight: bold;
	vertical-align: bottom;
	color: #2c1a00;
	text-align: left;
	width: 100%;
}

table.contentpaneopen h3 {
	margin-top: 25px;
}

h4 {
	font-family: Georgia, "Trebuchet MS", sans-serif;
	color: #333;
}

h3, .componentheading, table.moduletable th, legend {
	margin: 0;
	font-weight: bold;
	font-family: Georgia, "Trebuchet MS", sans-serif;
	color: #000000;
	font-size: 1.4em;
	padding-left: 0px;
	margin-bottom: 10px;
	text-align: left;

}


/* small text */
.small {
	font-size: .90em;
	color: #666;
	font-weight: normal;
	text-align: left;
}

.modifydate {
	height: 20px;
	vertical-align: bottom;
	font-size: .90em;
	color: #666;
	font-weight: normal;
	text-align: left;
}

.createdate {
	height: 20px;
	vertical-align: top;
	font-size: .90em;
	color: #666;
	font-weight: normal;
	vertical-align: top;
	padding-bottom: 5px;
	padding-top: 0px;

}

a.readon {
	margin-top: 10px;
	display: block;
	float: left;
	padding-right: 20px;
	line-height: 14px;
	height: 16px;
}

/* form validation */
.invalid { border-color: #ff0000; }
label.invalid { color: #ff0000; }


/** overlib **/

.ol-foreground {
	background-color: #f1f1f1;
	color: #333;
}

.ol-background {
	background-color: #f1f1f1;
	color: #333;
}

.ol-textfont {
	font-family: Georgia, "Trebuchet MS", sans-serif;
	font-size: 12px;
}

.ol-captionfont {
	font-family: Georgia, "Trebuchet MS", sans-serif;
	font-size: 12px;
	color: #f6f6f6;
	font-weight: bold;
}
.ol-captionfont a {
	background-color: #f1f1f1;
	color: #333;
	text-decoration: none;
	font-size: 12px;
}

.ol-closefont {}

/* menu links */
a.mainlevel:link, a.mainlevel:visited {
	padding-left: 5px;
font-size: 12px;

}

a.mainlevel:hover {
	color: #FF7A00;
font-size: 12px;

}

/* spacers */
span.article_separator {
	display: block;
	height: 20px;
}

.article_column {
	padding-right: 5px;
}

.column_separator {
	border-left: 0px dashed #e0e0e0;
	padding-left: 10px;
}

td.buttonheading {
	text-align: right;
}

.clr {
	clear: both;
}


div#maindivider {
  border-top: 1px solid #ddd;
  margin-bottom: 10px;
  overflow: hidden;
  height: 1px;
}

table.blog span.article_separator {
	display: block;
	height: 20px;
}

/* table of contents */
table.contenttoc {
  margin: 5px;
  border: 1px solid #ccc;
  padding: 5px;
font-size: 12px;

}

table.contenttoc td {
  padding: 0 5px;
font-size: 12px;

}


/* content tables */
td.sectiontableheader {
  color: #605A57;
  font-weight: bold;
  padding: 4px;
  border-bottom: 1px solid #605A57;
}

tr.sectiontableentry0 td,
tr.sectiontableentry1 td,
tr.sectiontableentry2 td {
  padding: 4px;
}

td.sectiontableentry0,
td.sectiontableentry1,
td.sectiontableentry2 {
  padding: 3px;
  color: #2c1a00;
}


/* content styles */
table.contentpaneopen, table.contentpane {
	margin: 0;
	padding: 0;
	width: auto;
	
}


table.contentpane td{
	text-align: left;
}

table.contentpane td.contentdescription {
	width: 100%;
}

table.contentpane  {
	text-align: left;
	float: left;
	width: 100%;

}

table.contentpane ul li a .category {
	color: #FF8800;
}

table.contentpane ul li {
	color:#666;
}

table.contentpaneopen li {
	margin-bottom: 5px;
}

table.contentpaneopen fieldset {
	border: 0;
	border-top: 1px solid #ddd;
}

table.contentpaneopen h3 {
	margin-top: 25px;
}

table.contentpaneopen h4 {
	font-family: Georgia, "Trebuchet MS", sans-serif;
	color: #333;
}

.highlight {
	background-color: #fffebb;
}

/* module control elements */
table.user1user2 div.moduletable {
	margin-bottom: 0px;
}

div.moduletable, div.module {
  margin-bottom: 25px;
}

div.module_menu, div.module {
	margin: 0;
	padding: 0;
	margin-bottom: 44px;
	width:221px;
}

div.module_menu div div div, div.module div div div{
	padding: 0px;
	width: auto;
}

div.module_menu div div div div, div.module div div div div {
	background: none;
	padding: 0;
}

div.module_menu ul {
	margin: 10px 0;
	padding-left: 10px;
	list-style:none;
}

div.module_menu ul li{
	margin: 0;
	padding: 0;
}

div.module_menu ul li a:link, div.module_menu ul li a:visited {
	font-weight: bold;
	background:transparent url(../images/blue/bullet2.jpg) top left no-repeat;
	padding: 2px 0 2px 25px;
	line-height: 24px;
}

#leftcolumn div.module table ,#rightcolumn div.module table {
	width: 180px;
}

#leftcolumn div.module table.poll {
	padding-top: 46px;
}

#leftcolumn h3, #rightcolumn h3 {
	margin: 0 auto; 	
	color: #000000;
	font-weight: bold;
	font-family: Georgia, "Trebuchet MS", sans-serif;
	font-size: 1.2em;
	line-height: 20px;
	text-align: left;
	text-align: center;
background-color: #FF7A00;
}

#leftcolumn .moduletable_menu, #leftcolumn .moduletable, #leftcolumn .moduletable_text, #leftcolumn .c, 
#rightcolumn .moduletable_menu, #rightcolumn .moduletable, #rightcolumn .moduletable_text, #rightcolumn .c {
	margin: 0 0 20px 0;
	padding: 3px;	
	font-size: 12px;
}

#leftcolumn ul.menu, #rightcolumn ul.menu {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: none;
	width: 180px;
	font-size: 12px;
}

#leftcolumn ul.menu li, #rightcolumn ul.menu li {
	margin: 0;
	padding: 0;
	font-size: 12px;
}

#leftcolumn ul.menu li:hover, #rightcolumn ul.menu li:hover {
	margin:0;
	padding:0;	
	color: #FF7A00;
	font-size: 12px;
}

#leftcolumn ul.menu li a, #leftcolumn ul.menu li a:link,
#rightcolumn ul.menu li a, #rightcolumn ul.menu li a:link {
	display: block;
	line-height: 20px;
	padding: 0;
	text-decoration: none;
	color: #2c1a00;
	font-weight: normal;
	font-size: 1.2em;
	margin: 0;
	width: 160px;
	background: url(../images/menurow.jpg) bottom center no-repeat;
}

#leftcolumn ul.menu li a:hover, #rightcolumn ul.menu li a:hover {
	color: #FF7A00;
font-size: 1.2em;
}

/* ****** left col current menu ****** */
#leftcolumn ul.menu li#current a, #leftcolumn ul.menu li#current a:link, 
#rightcolumn ul.menu li#current a, #rightcolumn ul.menu li#current a:link {
	display: block;
	line-height: 20px;
	padding: 0;
	text-decoration: none;
	font-size: 1.2em;
	color: #000;
	background: url(../images/menurow.jpg) bottom center no-repeat;
	height: 20px;
font-weight:bold;
}

#leftcolumn ul.menu li#current a:hover, #rightcolumn ul.menu li#current a:hover {
display: block;
	line-height: 20px;
	padding: 0;
	text-decoration: none;
	font-size: 1.2em;
	color: #000;
	background: url(../images/menurow.jpg) bottom center no-repeat;
	height: 20px;
font-weight:bold;
}

#leftcolumn ul.menu li ul li#current a:visited, #leftcolumn ul.menu li ul li#current a:hover {
	background: url(../images/menurow.jpg) bottom center no-repeat;
	color: #000;
	height: 20px;
	font-size: 12px;
	padding: 0 0 0 0px;
	margin: 0 0 0 0px;
font-weight:normal;
}

/* ****** left col sub menu ****** */
#leftcolumn ul.menu li ul, #rightcolumn ul.menu li ul {
	margin: 0px 0px 0px 0px;
	list-style: none;
font-weight:normal;
	color: #2c1a00;
	font-size: 12px;
}

#leftcolumn ul.menu li#current{
	text-decoration: none;
	color: #2c1a00;
	font-size: 12px;
	background: transparent;
font-weight:normal;
	margin: 0px 0px 0px 0px;
}

#leftcolumn ul.menu li#current a:link {
	background: transparent;
font-weight:normal;
	color: #2c1a00;
	font-size: 12px;
	margin: 0px 0px 0px 0px;
}

#leftcolumn ul.menu li#current ul li a, #leftcolumn ul.menu li#current ul li a:link {
	text-decoration: none;
	color: #2c1a00;
	margin: 0px 0px 0px 0px;
	padding: 0;
	font-size: 12px;
	background: none;
font-weight:normal;
}

#leftcolumn ul.menu li#current ul li a:link {
	text-decoration: none;
	color: #2c1a00;
	margin: 0px 0px 0px 0px;
	padding: 0;
	font-size: 12px;
	background: none;
font-weight:normal;
}


#leftcolumn ul.menu li#current ul li {
font-weight:normal;	
	color: #2c1a00;
	font-size: 12px;
	margin: 0px 0px 0px 0px;
}

#leftcolumn ul.menu li#current ul li a:hover {
	color: #FF7A00;
	font-size: 12px;
font-weight:normal;	
	margin: 0px 0px 0px 0px;
}

/* forms */
#leftcolumn .moduletable ul, #rightcolumn .moduletable ul {
	margin:6px 0;
	padding:0;
	list-style:none;
font-size: 12px;

}

#leftcolumn .moduletable ul li, #rightcolumn .moduletable ul li {
	margin:0;
	padding:0 2px;
}

table.adminform textarea {
  width: 540px;
  height: 400px;
  font-size: 1em;
  color: #000099;
}

div.search input {
	width: 145px;
	border: 1px solid #ccc;
	margin: 15px 0 10px 0;
}

form#form-login fieldset { 
	border: 0 none; 
	margin: 0; 
}
form#form-login ul li{ 
	padding: 0; 
}

form#form-login ul li a {
	text-align: left;
}

/* thumbnails */
div.mosimage         {  margin: 5px; }
div.mosimage_caption {  font-size: .90em; color: #666; }

div.caption       { padding: 0 10px 0 10px; }
div.caption img   { border: 1px solid #CCC; }
div.caption p     { font-size: .90em; color: #666; text-align: center; }

/* Parameter Table */
table.paramlist {
	margin-top: 5px;
}

table.paramlist td.paramlist_key {
	width: 128px;
	text-align: left;
	height: 30px;
}

table.paramlist td.paramlist_value {
}

div.message {
	font-family: Georgia, "Trebuchet MS", sans-serif;
	font-weight: bold;
	font-size : 14px;
	color : #c30;
	text-align: center;
	width: auto;
	background-color: #f9f9f9;
	border: solid 1px #d5d5d5;
	margin: 3px 0px 10px;
	padding: 3px 20px;
}

/* Banners module */

/* Default skyscraper style */
.bannergroup {
}

.banneritem {
}

/* Text advert style */

.banneritem_text {
	padding: 4px;
	font-size: 11px;
}

.bannerfooter_text {
	padding: 4px;
	font-size: 11px;
	text-align: right;
}

/* System Messages */
/* see system general.css */

.pagination span { padding: 2px; }
.pagination a    { padding: 2px; }

/* Polls */
.pollstableborder td {
	text-align: left;
}

/* Frontend Editing*/
fieldset {
	border: 1px solid #ccc;
	margin-top: 15px;
	padding: 15px;
}

legend {
	margin: 0;
	padding: 0 10px;
}

td.key {
	border-bottom:1px solid #eee;
	color: #666;
}

/* Tooltips */
.tool-tip {
	float: left;
	background: #ffc;
	border: 1px solid #D4D5AA;
	padding: 5px;
	max-width: 200px;
}

.tool-title {
	padding: 0;
	margin: 0;
	font-size: 100%;
	font-weight: bold;
	margin-top: -15px;
	padding-top: 15px;
	padding-bottom: 5px;
	background: url(../../system/images/selector-arrow.png) no-repeat;
}

.tool-text {
	font-size: 100%;
	margin: 0;
}

/* System Standard Messages */
#system-message dd.message ul { 
	background: #C3D2E5;
	padding: 0;
	margin: 0;
}

/* System Error Messages */
#system-message dd.error ul { 
	color: #c00; 
	background: #E6C0C0; 
	border-top: 3px solid #DE7A7B; 
	border-bottom: 3px solid #DE7A7B;
	padding: 0;
	margin: 0;
}

/* System Notice Messages */
#system-message dd.notice ul { 
	color: #c00; 
	background: #EFE7B8; 
	border-top: 3px solid #F0DC7E; 
	border-bottom: 3px solid #F0DC7E;
	padding: 0;
	margin: 0;
}



/* ****************************************************************************** */
/* blue */
input,button {
	color: #2c1a00;
}

/* blue */


h3, .componentheading, table.moduletable th {
  color: #938e80;
}

div.module_menu, div.module {
	
}

div.module_menu div, div.module div{
	
}

div.module_menu div div, div.module div div {
	
}

div.module_menu div div div, div.module div div div {
	
}

/* ********************************************************************************* */
/* blue */
#page_bg {
	padding: 0;
	margin-bottom: 1px;
	background: #f3f2e7;
}

div#header {
	background: url(../images/header.jpg) top left no-repeat;
	height: 230px;
	width: 870px;
	margin: 0 auto;
}

div#homelink a {
	background: transparent;
	width: 110px;
	height: 50px;
	position: absolute;
	top: 150px;
	right: 440px;
	outline: none;
}

#top {
	width: 100%;
	margin: 0 auto 50px auto;
	height: 235px;
}

.main_table {
	margin: 0 auto;
}

#banner_l {
	text-align: left;
}

#foot {
	width: 100%;
}

#footer {
	margin: 0 auto;
	width: 830px;
	height: 80px;
	text-align: center;
	vertical-align: top;
	background: url(../images/footer.jpg) bottom center no-repeat;
}

/* ********************************************************************** */

input&#91;type="checkbox"&#93;, input&#91;type="radio"&#93;{
   background: transparent;
   border: none;
}

/* -------------------------- */
a.sgfooter:link, a.sgfooter:visited {
	color: #2c1a00;
	font-family: Georgia, "Trebuchet MS", sans-serif;
	text-decoration: none;
}
a.sgfooter:hover {
	color: #2c1a00;
	font-family: Georgia, "Trebuchet MS", sans-serif;
	text-decoration: none;
}
#sgf {
	font-size: 11px;
	text-align: center;
	width: 100%;
	margin: 0px auto;
	color: #2c1a00;
	font-family: Georgia, "Trebuchet MS", sans-serif;
}
.sgf {
	text-align: right;
	font-size: 11px;
	font-family: Georgia, "Trebuchet MS", sans-serif;
	color: #2c1a00;
	text-decoration: none;
}
.sgf1 {
	font-size: 11px;
	font-family: Georgia, "Trebuchet MS", sans-serif;
	color: #2c1a00;
	text-align: left;
}

a.sglink:link, a.sglink:visited {
	color: #2c1a00;
	font-size: 11px;
	font-family: Georgia, "Trebuchet MS", sans-serif;
	text-decoration: none;
}
a.sglink:hover {
	color: #2c1a00;
	font-family: Georgia, "Trebuchet MS", sans-serif;
	text-decoration: none;
	}

	
#vline {
	background: transparent url(../images/dot.gif) top left repeat-y;
}

DietmarH
Neues Mitglied

Mehr

27 Feb. 2008 12:26 #12254 von DietmarH

DietmarH antwortete auf Re: css für submenü

Benutz einfach den Firebug, um die richtigen Klassen zu finden.
--ALTER LINK WURDE ENTFERNT--

Roxxinger
Autor
Neues Mitglied

Mehr

27 Feb. 2008 14:13 #12264 von Roxxinger

Roxxinger antwortete auf Re: css für submenü

DietmarH schrieb: Benutz einfach den Firebug, um die richtigen Klassen zu finden.
--ALTER LINK WURDE ENTFERNT--

hm würd ich ja gern bekomme firefox derzeit aber nicht zum laufen

ka lädt einfach keine seiten, neuinstallation etc hilft nix

ghosty
Offline

Mehr

27 Feb. 2008 14:16 #12265 von ghosty

ghosty antwortete auf Re: css für submenü

Hi Jan,

hängt er evt. bei der Firewall fest? Hab das selbe Probs mit IE

Gruess

Peter

Roxxinger
Autor
Neues Mitglied

Mehr

27 Feb. 2008 14:40 #12266 von Roxxinger

Roxxinger antwortete auf Re: css für submenü

dachte ich auch aber alles schon mal ausgeschaltet, profil neu erstellt, und einstellungen überprüft hilft alles nichts

Marco85
Neues Mitglied

Mehr

28 Feb. 2008 03:18 #12289 von Marco85

Marco85 antwortete auf Re: css für submenü

Hallo

Code:

#leftcolumn ul.menu li ul li#current a:visited, #leftcolumn ul.menu li ul li#current a:hover {

	color: #000;
	height: 20px;
	font-size: 12px;
	padding: 0 0 0 0px;
	margin: 0 0 0 0px;
font-weight:normal;
}

Hier "font-weight:normal" rausschmeissen.

Code:

#leftcolumn ul.menu li ul, #rightcolumn ul.menu li ul {
	margin: 0px 0px 0px 0px;
	list-style: none;
font-weight:normal;
	color: #2c1a00;
	font-size: 12px;
}

Hier den margin-left Wert ändern, z.B. "margin:0 0 0 -30px". Wichtig mit Minus vor dem Wert, ansonsten verschiebt sich das ganze nach rechts.

Roxxinger
Autor
Neues Mitglied

Mehr

28 Feb. 2008 11:31 #12316 von Roxxinger

Roxxinger antwortete auf Re: css für submenü

G_O_O_D D hat das was mit der angabe einmal in px und einmal in em zutun?

also die submenü punkte scheinen immer ein bischen kleiner zu sein

gruß jan

Marco85
Neues Mitglied

Mehr

28 Feb. 2008 11:47 #12318 von Marco85

Marco85 antwortete auf Re: css für submenü

Hallo Jan

Cool, Gründe gleich ne Sekte:-).

Ja. 1.2 em bedeutet 20% grösser als die Standartgrösse (Vererbung). Ist keine Standartgrösse definiert, rechnet der Browser mit der Standartgrösse des Benutzers. Die Erklärung ist aber ohne Gewähr. Entweder stellst du das Submenu auch auf 1.2em oder die erste Ebene auf px. Hier kannst mal was nachlesen zu den Schriftgraden: --ALTER LINK WURDE ENTFERNT--

Roxxinger
Autor
Neues Mitglied

Mehr

29 Feb. 2008 10:08 #12347 von Roxxinger

Roxxinger antwortete auf Re: css für submenü

danke schön

Moderatoren: Tribal6, RePao, Dragonlord, Chris Hoefliger, pascale, adiheutschi.ch

Joomla! Forum Schweiz wird Teil der D-A-CH Community

forum.joomla.de

css für submenü