superfish menu template style
lima-city → Forum → Die eigene Homepage → Homepage Allgemein
auto
blocken
boxen
button
display
form
image
index
list
login
logo name
match
page
position
radius
span
system
text
type
url
-
hallo, ich hab bei joomla 1.5 gerade superfish menu installiert, funktioniert auch einwandfrei, aber ich möchte dass dieses menü die menü einstellungen (farbe, grafiken,...) vom template bezieht.
Wie muss ich das machen?
Hoffe auf Antworten -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
stargate schrieb: Hoffe auf Antworten
Hoffen trifft es relativ gut Schon mal daran gedacht für die Unwissenden mit der Glaskugel einen Link zur Seite zu posten und dann auch erläutern was superfish überhaupt sein soll...
In einer gewissen "superfish.css" lagern die ganzen Style-Angaben. D.h. du musst diese Suchen und bearbeiten. Da keiner genau weiß, wie du es gerne hättest, müssest du das selbst machen.
Aber ich glaube es sieht schon besser aus, wenn du bei ".sf-menu li" und ".sf-menu li li" einfach das "background"-Attribut entfernst. -
habs jetzt versucht aber es funktioniert leider nicht, kann mir bitte jemand helfen?
hab hier den code fürs superfish menu
/*** ESSENTIAL STYLES ***/ .sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; } .sf-menu { line-height: 1.0; } .sf-menu ul { position: absolute; top: -999em; width: 10em; /* left offset of submenus need to match (see below) */ } .sf-menu ul li { width: 100%; } .sf-menu li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ } .sf-menu li { float: left; position: relative; } .sf-menu a { display: block; position: relative; } .sf-menu li:hover ul, .sf-menu li.sfHover ul { left: 0; top: 2.5em; /* match top ul list item height */ z-index: 99; } ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul { top: -999em; } ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul { left: 10em; /* match ul width */ top: 0; } ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul { top: -999em; } ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul { left: 10em; /* match ul width */ top: 0; } /*** DEMO SKIN ***/ .sf-menu { float: left; margin-bottom: 1em; } .sf-menu a { border-left: 1px solid #fff; border-top: 1px solid #CFDEFF; padding: .75em 1em; text-decoration:none; } .sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/ color: #13a; } .sf-menu li { background: #BDD2FF; } .sf-menu li li { background: #AABDE6; } .sf-menu li li li { background: #9AAEDB; } .sf-menu li:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { background: #CFDEFF; outline: 0; } .sf-menu li .separator { display: block; border-left: 1px solid #fff; border-top: 1px solid #CFDEFF; padding: .75em 1em; text-decoration:none; } /*** arrows **/ .sf-menu a.sf-with-ul { padding-right: 2.25em; min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */ } .sf-sub-indicator { position: absolute; display: block; right: .75em; top: 1.05em; /* IE6 only */ width: 10px; height: 10px; text-indent: -999em; overflow: hidden; background: url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */ } a > .sf-sub-indicator { /* give all except IE6 the correct values */ top: .8em; background-position: 0 -100px; /* use translucent arrow for modern browsers*/ } /* apply hovers to modern browsers */ a:focus > .sf-sub-indicator, a:hover > .sf-sub-indicator, a:active > .sf-sub-indicator, li:hover > a > .sf-sub-indicator, li.sfHover > a > .sf-sub-indicator { background-position: -10px -100px; /* arrow hovers for modern browsers*/ } /* point right for anchors in subs */ .sf-menu ul .sf-sub-indicator { background-position: -10px 0; } .sf-menu ul a > .sf-sub-indicator { background-position: 0 0; } /* apply hovers to modern browsers */ .sf-menu ul a:focus > .sf-sub-indicator, .sf-menu ul a:hover > .sf-sub-indicator, .sf-menu ul a:active > .sf-sub-indicator, .sf-menu ul li:hover > a > .sf-sub-indicator, .sf-menu ul li.sfHover > a > .sf-sub-indicator { background-position: -10px 0; /* arrow hovers for modern browsers*/ } /*** shadows for all but IE6 ***/ .sf-shadow ul { background: url('../images/shadow.png') no-repeat bottom right; padding: 0 8px 9px 0; -moz-border-radius-bottomleft: 17px; -moz-border-radius-topright: 17px; -webkit-border-top-right-radius: 17px; -webkit-border-bottom-left-radius: 17px; } .sf-shadow ul.sf-shadow-off { background: transparent; }
und hier ist der code meiner style.css datei, kann jemand daraus bitte etwas machen?
/* begin Page */ body { margin: 0 auto; padding: 0; background-color: #353635; background-image: url('../images/Page-BgTexture.jpg'); background-repeat: repeat; background-attachment: fixed; background-position: top left; } .Main { position: absolute; width: 100%; left: 0; top: 0; } .PageBackgroundGlare { position: absolute; width: 100%; left: 0; top: 0; } .PageBackgroundGlareImage { background-image: url('../images/Page-BgGlare.png'); background-repeat: no-repeat; height: 343px; width: 353px; margin: 0; } html:first-child .PageBackgroundGlare { border: 1px solid transparent; /* Opera fix */ } .cleared { float: none; clear: both; margin: 0; padding: 0; border: none; font-size:1px; } /* end Page */ /* begin Box, Sheet */ .Sheet { overflow: hidden; min-width:31px; min-height:31px; margin: 0 auto; position: relative; z-index: 0; width: 1003px; } .Sheet-body { position: relative; z-index: 0; margin: 7px; } .Sheet-tl { position: absolute; overflow: hidden; z-index: -1; top: 0; left: 0; width: 29px; height: 29px; background-image: url('../images/Sheet-s.png'); } .Sheet-tr { position: absolute; overflow: hidden; z-index: -1; top: 0; right: 0; width: 29px; height: 29px; } .Sheet-tr div { position: absolute; z-index: -1; top: 0px; left: -29px; width: 58px; height: 58px; background-image: url('../images/Sheet-s.png'); } .Sheet-bl { position: absolute; overflow: hidden; z-index: -1; bottom: 0; left: 0; width: 29px; height: 29px; } .Sheet-bl div { position: absolute; z-index: -1; top: -29px; left: 0; width: 58px; height: 58px; background-image: url('../images/Sheet-s.png'); } .Sheet-br { position: absolute; overflow: hidden; z-index: -1; bottom: 0; right: 0; width: 29px; height: 29px; } .Sheet-br div { position: absolute; z-index: -1; top: -29px; left: -29px; width: 58px; height: 58px; background-image: url('../images/Sheet-s.png'); } .Sheet-tc { position: absolute; overflow:hidden; z-index: -1; top: 0; left: 29px; right: 29px; height: 29px; } .Sheet-tc div { position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 58px; background-image: url('../images/Sheet-h.png'); } .Sheet-bc { position: absolute; overflow:hidden; z-index: -1; bottom: 0; left: 29px; right: 29px; height: 29px; } .Sheet-bc div { position: absolute; z-index: -1; top: -29px; left: 0; width: 100%; height: 58px; background-image: url('../images/Sheet-h.png'); } .Sheet-cl { position: absolute; overflow:hidden; z-index: -1; top: 29px; left: 0; width: 29px; bottom: 29px; } .Sheet-cl div { position: absolute; z-index: -1; top: 0; left: 0; width: 58px; height: 100%; background-image: url('../images/Sheet-v.png'); } .Sheet-cr { position: absolute; overflow:hidden; z-index: -1; top: 29px; right: 0; width: 29px; bottom: 29px; } .Sheet-cr div { position: absolute; z-index: -1; top: 0; left: -29px; width: 58px; height: 100%; background-image: url('../images/Sheet-v.png'); } .Sheet-cc { position: absolute; overflow:hidden; z-index: -2; top: 29px; left: 29px; right: 29px; bottom: 29px; background-image: url('../images/Sheet-c.png'); } .Sheet { margin-top: -7px !important; } /* end Box, Sheet */ /* begin Header */ div.Header { margin: 0 auto; position: relative; z-index:0; width: 989px; height: 200px; } div.Header-jpeg { position: absolute; z-index:-1; top: 0; left: 0; width: 989px; height: 200px; background-image: url('../images/Header.jpg'); background-repeat: no-repeat; background-position: center center; } /* end Header */ <!-- ... --> <style type="text/css"> @import url(<?php echo $mosConfig_live_site; ?>/templates/designnew/css/menu.css); </style> <!-- ... --> /* begin Logo */ .logo { display : block; position: absolute; left: {LogoLeft}px; top: {LogoTop}px; width: {LogoWidth}px; } h1.logo-name { display: block; text-align: {HorizontalAlign}; } h1.logo-name, h1.logo-name a, h1.logo-name a:link, h1.logo-name a:visited, h1.logo-name a:hover { {LogoNameFont} padding:0; margin:0; color: {NameFontColor} !important; } .logo-text { display: block; text-align: {HorizontalAlign}; } .logo-text, .logo-text a { {LogoSloganFont} padding:0; margin:0; color: {TextFontColor} !important; } /* end Logo */ /* begin Menu */ /* menu structure */ .artmenu a, .artmenu a:link, .artmenu a:visited, .artmenu a:hover { text-align:left; text-decoration:none; outline:none; letter-spacing:normal; word-spacing:normal; } .artmenu, .artmenu ul { margin: 0; padding: 0; border: 0; list-style-type: none; display: block; } .artmenu li { margin: 0; padding: 0; border: 0; display: block; float: left; position: relative; z-index: 5; background:none; } .artmenu li:hover { z-index: 10000; white-space: normal; } .artmenu li li { float: none; } .artmenu ul { visibility: hidden; position: absolute; z-index: 10; left: 0; top: 0; background:none; } .artmenu li:hover>ul { visibility: visible; top: 100%; } .artmenu li li:hover>ul { top: 0; left: 100%; } .artmenu:after, .artmenu ul:after { content: "."; height: 0; display: block; visibility: hidden; overflow: hidden; clear: both; } .artmenu, .artmenu ul { min-height: 0; } .artmenu ul { background-image: url(../images/spacer.gif); padding: 10px 30px 30px 30px; margin: -10px 0 0 -30px; } .artmenu ul ul { padding: 30px 30px 30px 10px; margin: -30px 0 0 -10px; } /* menu structure */ .nav { position: relative; margin: 0 auto; width: 989px; height: 28px; z-index: 100; } .artmenu { padding: 3px 3px 3px 3px; } .nav .l, .nav .r, .nav .r div { top: 0; position: absolute; z-index: -1; overflow: hidden; height: 28px; } .nav .l { left: 0; right: 0px; } .nav .r { right: 0; width: 0px; } .nav .r div { width: 989px; right: 0; } .nav .l, .nav .r div { background-position: left top; background-repeat: no-repeat; background-image: url('../images/nav.png'); } /* end Menu */ /* begin MenuItem */ .artmenu ul li { clear: both; } .artmenu a , .artmenu a span { height: 22px; display: block; } .artmenu a { cursor: pointer; text-decoration: none; margin-right: 4px; margin-left: 4px; } .artmenu a { background-image: url('../images/item-left.png'); background-position: left top; background-repeat: no-repeat; } .artmenu a span { background-image: url('../images/item-right.png'); background-position: right top; background-repeat: no-repeat; } .artmenu a span span { font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-size: 10px; font-style: normal; font-weight: bold; text-decoration: none; text-transform: uppercase; color: #C1D1DC; padding: 0 15px; margin: 0 8px; line-height: 22px; text-align: center; background-image: url('../images/item-center.png'); background-position: left top; background-repeat: repeat-x; } .artmenu a:hover { background-position: left -22px; } .artmenu li:hover>a { background-position: left -22px; } .artmenu li:hover a span { background-position: right -22px; } .artmenu a:hover span { background-position: right -22px; } .artmenu a:hover span span { color: #EFF3F6; background-position: left -22px; } .artmenu li:hover a span span { color: #EFF3F6; background-position: left -22px; } .artmenu a.active { background-position: left -44px; } .artmenu a.active span { background-position: right -44px; } .artmenu a.active span span { color: #DBE5EB; background-position: left -44px; } /* end MenuItem */ /* begin ContentLayout */ .contentLayout { margin-bottom: 0px; width: 989px; position: relative; } /* end ContentLayout */ /* begin Box, Block */ .Block { overflow: hidden; min-width:1px; min-height:1px; margin: 0 auto; position: relative; z-index: 0; } .Block-body { position: relative; z-index: 0; margin: 0px; } .Block { margin: 7px; } /* end Box, Block */ /* begin BlockHeader */ .BlockHeader { position: relative; overflow: hidden; height: 30px; z-index: 0; line-height: 30px; padding: 0 7px; margin-bottom: 7px; } .BlockHeader-text { white-space : nowrap; color: #EFF3F6; font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-size: 13px; font-variant: small-caps; line-height: 30px; } .BlockHeader .l, .BlockHeader .r, .BlockHeader .r div { top: 0; position: absolute; z-index: -1; overflow: hidden; height: 30px; } .BlockHeader .l { left: 0; right: 0px; } .BlockHeader .r { right: 0; width: 0px; } .BlockHeader .r div { width: 989px; right: 0; } .BlockHeader .l, .BlockHeader .r div { background-position: left top; background-repeat: no-repeat; background-image: url('../images/BlockHeader.png'); } .header-tag-icon { display:inline-block; background-position:left top; background-image: url('../images/BlockHeaderIcon.png'); padding:0 0 0 24px; background-repeat: no-repeat; min-height: 17px; margin: 0 0 0 5px; } /* end BlockHeader */ /* begin Box, BlockContent */ .BlockContent { overflow: hidden; min-width:1px; min-height:1px; margin: 0 auto; position: relative; z-index: 0; } .BlockContent-body { position: relative; z-index: 0; margin: 7px; } .BlockContent-body { color:#ADC3D1; font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-size: 11px; } .BlockContent-body a:link { color: #A7BECD; font-family: Tahoma, Arial, Helvetica, Sans-Serif; text-decoration: none; } .BlockContent-body a:visited, .BlockContent-body a.visited { color: #A7BECD; font-family: Tahoma, Arial, Helvetica, Sans-Serif; text-decoration: none; } .BlockContent-body a:hover, .BlockContent-body a.hover { color: #A7BECD; font-family: Tahoma, Arial, Helvetica, Sans-Serif; text-decoration: underline; } .BlockContent-body ul { list-style-type: none; color: #D5E0E7; margin:0; padding:0; } .BlockContent-body li { font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-size: 11px; } .BlockContent-body ul li { padding:0px 0 0px 11px; background-image: url('../images/BlockContentBullets.png'); background-repeat:no-repeat; margin:0.5em 0 0.5em 0; line-height:1.2em; } /* end Box, BlockContent */ /* begin Box, Post */ .Post { overflow: hidden; min-width:1px; min-height:1px; margin: 0 auto; position: relative; z-index: 0; } .Post-body { position: relative; z-index: 0; margin: 7px; } .Post { margin: 10px; } /* Start images */ a img { border: 0; } .article img, img.article { border-style: solid; border-width: 0px; border-color: #8DABBF; margin: 1em; } .metadata-icons img { border: none; vertical-align: middle; margin:2px; } /* Finish images */ /* Start tables */ .article table, table.article { border-collapse: collapse; margin: 1px; width:auto; } .article table, table.article .article tr, .article th, .article td { background-color:Transparent; } .article th, .article td { padding: 2px; border: solid 1px #426176; vertical-align: top; text-align:left; } .article th { text-align:center; vertical-align:middle; padding: 7px; } /* Finish tables */ /* end Box, Post */ /* begin PostMetadata */ .PostMetadataHeader { background-color: #B7CAD7; border-color: #8DABBF; border-style: dotted; border-width: 1px; padding:3px; } /* end PostMetadata */ /* begin PostHeaderIcon */ .PostHeaderIcon-wrapper { text-decoration:none; margin: 0.2em 0; padding: 0; font-weight:normal; font-style:normal; letter-spacing:normal; word-spacing:normal; font-variant:normal; text-decoration:none; font-variant:normal; text-transform:none; text-align:left; text-indent:0; line-height:inherit; font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; font-size: 25px; text-align: center; color: #1D2B34; } .PostHeaderIcon-wrapper, .PostHeaderIcon-wrapper a, .PostHeaderIcon-wrapper a:link, .PostHeaderIcon-wrapper a:visited, .PostHeaderIcon-wrapper a:hover { font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; font-size: 25px; text-align: center; color: #1D2B34; } /* end PostHeaderIcon */ /* begin PostHeader */ .PostHeader a:link { font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; text-decoration: none; font-variant: small-caps; color: #273945; } .PostHeader a:visited, .PostHeader a.visited { font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; text-decoration: none; font-variant: small-caps; color: #334B5B; } .PostHeader a:hover, .PostHeader a.hovered { font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; text-decoration: none; font-variant: small-caps; color: #375162; } /* end PostHeader */ /* begin PostContent */ /* Content Text Font & Color (Default) */ body { font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-size: 11px; font-style: normal; font-weight: normal; color: #ADC3D1; } .PostContent { font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-style: normal; font-weight: normal; text-align: justify; color: #ADC3D1; } /* Start Content link style */ /* The right order of link pseudo-classes: Link-Visited-Hover-Focus-Active. http://www.w3schools.com/CSS/css_pseudo_classes.asp http://meyerweb.com/eric/thoughts/2007/06/11/who-ordered-the-link-states/ */ a { font-family: Tahoma, Arial, Helvetica, Sans-Serif; text-decoration: underline; color: #A7BECD; } /* Adds special style to an unvisited link. */ a:link { font-family: Tahoma, Arial, Helvetica, Sans-Serif; text-decoration: underline; color: #A7BECD; } /* Adds special style to a visited link. */ a:visited, a.visited { font-family: Tahoma, Arial, Helvetica, Sans-Serif; text-decoration: none; color: #A7BECD; } /* :hover - adds special style to an element when you mouse over it. */ a:hover, a.hover { font-family: Tahoma, Arial, Helvetica, Sans-Serif; text-decoration: none; color: #A7BECD; } /* Finish Content link style */ /* Resert some headings default style & links default style for links in headings*/ h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited { font-weight: normal; font-style: normal; text-decoration: none; } /* Start Content headings Fonts & Colors */ h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover { font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; font-size: 27px; color: #E8EEF2; } h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover { font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; font-size: 25px; color: #C8D6E0; } h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover { font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; font-size: 16px; color: #C8D6E0; } h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover { font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; font-size: 14px; color: #D5E0E7; } h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover { font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; font-size: 13px; color: #D5E0E7; } h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover { font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; font-size: 11px; color: #D5E0E7; } /* Finish Content headings Fonts & Colors */ /* end PostContent */ /* begin PostBullets */ /* Start Content list */ ul { list-style-type: none; color: #C1D1DC; margin:0; padding:0; } li { font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-size: 11px; } .Post ul li { padding:3px 0 3px 26px; background-image: url('../images/PostBullets.png'); background-repeat:no-repeat; margin:0.5em 0 0.5em 0; line-height:1.2em; } /* Finish Content list */ /* end PostBullets */ /* begin PostQuote */ /* Start blockquote */ blockquote p { color:#090D10; font-family: Tahoma, Arial, Helvetica, Sans-Serif; } blockquote { border-color:#8DABBF; border-width: 1px; border-style: solid; margin:10px 10px 10px 50px; padding:5px 5px 5px 27px; background-color:#B7CAD7; background-image:url('../images/PostQuote.png'); background-position:left top; background-repeat:no-repeat; } /* Finish blockuote */ /* end PostQuote */ /* begin Button */ button.Button, a.Button { position:relative; display:inline-block; width: auto; outline:none; border:none; background:none; line-height:28px; margin:0; padding:0; overflow: visible; cursor: default; text-decoration: none !important; } /*This HACK needed for ie7 (button position)*/ *:first-child+html button.Button, *:first-child+html a.Button { display:list-item; list-style-type:none; float:left; } .Button .btn { position: relative; overflow: hidden; display: block; width: auto; z-index: 0; height: 28px; color: #F2F5F8; white-space: nowrap; float: left; } .Button .t { height:28px; white-space: normal; padding: 0 13px; font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-size: 10px; font-style: normal; font-weight: bold; text-transform: uppercase; text-align: left; line-height: 28px; text-decoration: none !important; } input, select { font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-size: 10px; font-style: normal; font-weight: bold; text-transform: uppercase; } .Button .active { color: #EFF3F6; } .Button .hover, a.Button:hover { color: #E5ECF0; text-decoration: none !important; } .Button .active .r { top: -56px; } .Button .hover .r { top: -28px; } .Button .r { display: block; position: absolute; overflow: hidden; z-index: -1; top: 0; right: 0; width: 7px; height: 84px; } .Button .r span { display: block; position: absolute; overflow: hidden; z-index: -1; top: 0; right: 0; width:403px; height: 84px; } .Button .active .l { top: -56px; } .Button .hover .l { top: -28px; } .Button .l { display: block; position: absolute; overflow: hidden; z-index: -1; top: 0; left: 0; right: 7px; height: 84px; } .Button .l, .Button .r span { background-image: url('../images/Button.png'); } /* end Button */ /* begin Footer */ .Footer { position:relative; z-index:0; overflow:hidden; width: 989px; margin: 5px auto 0px auto; } .Footer .Footer-inner { height:1%; position: relative; z-index: 0; padding: 8px; text-align: center; } .Footer .Footer-background { position:absolute; z-index:-1; background-repeat:no-repeat; background-image: url('../images/Footer.png'); width: 989px; height: 100px; bottom:0; left:0; } .rss-tag-icon { position: relative; display:block; float:left; background-image: url('../images/livemarks.png'); background-position: center right; background-repeat: no-repeat; margin: 0 5px 0 0; height: 16px; width: 16px; } .Footer .Footer-text p { margin: 0; } .Footer .Footer-text { display:inline-block; color:#BECFDA; font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-size: 10px; } .Footer .Footer-text a:link { text-decoration: none; color: #A0B9CA; font-family: Tahoma, Arial, Helvetica, Sans-Serif; text-decoration: none; } .Footer .Footer-text a:visited { text-decoration: none; color: #A0B9CA; font-family: Tahoma, Arial, Helvetica, Sans-Serif; text-decoration: none; } .Footer .Footer-text a:hover { text-decoration: none; color: #599191; font-family: Tahoma, Arial, Helvetica, Sans-Serif; text-decoration: underline; } /* end Footer */ /* begin PageFooter */ .page-footer, .page-footer a, .page-footer a:link, .page-footer a:visited, .page-footer a:hover { font-family:Arial; font-size:10px; letter-spacing:normal; word-spacing:normal; font-style:normal; font-weight:normal; text-decoration:underline; color:#86A6BB; } .page-footer { margin:1em; text-align:center; text-decoration:none; color:#86A6BB; } /* end PageFooter */ /* begin LayoutCell */ .contentLayout .sidebar1 { position: relative; margin: 0; padding: 0; border: 0; float: left; overflow: hidden; width: 197px; } /* end LayoutCell */ /* begin LayoutCell */ .contentLayout .content { position: relative; margin: 0; padding: 0; border: 0; float: left; overflow: hidden; width: 594px; } /* end LayoutCell */ /* begin LayoutCell */ .contentLayout .sidebar2 { position: relative; margin: 0; padding: 0; border: 0; float: left; overflow: hidden; width: 197px; } /* end LayoutCell */ .contentLayout li { float: none; } table.moduletable th { font-size: 140%; padding: .5em 0em; } #footer { text-align: center; } .breadcrumbs { display: block; padding: .7em 0em; } .contentpaneopen span.small, .contentpaneopen td.createdate, .contentpaneopen td.modifydate { font-size: 75%; padding-bottom: 1em; } .article_column { padding-right: .2em; } .column_separator { padding-left: .4em; } .pagination span { padding: 2px; } .pagination a { padding: 2px; } div.offline { background: #fffebb; width: 100%; position: absolute; top: 0; left: 0; font-size: 1.2em; padding: 5px; } span.pathway { display: block; margin: 0 20px; height: 16px; line-height: 16px; overflow: hidden; } /* headers */ table.moduletable th, legend { margin: 0; font-weight: bold; font-family: Helvetica,Arial,sans-serif; font-size: 1.5em; padding-left: 0px; margin-bottom: 10px; text-align: left; } /* form validation */ .invalid { border-color: #ff0000; } label.invalid { color: #ff0000; } /** overlib **/ .ol-foreground { background-color: #f6f6f6; } .ol-background { background-color: #666; } .ol-textfont { font-family: Arial, Helvetica, sans-serif; font-size: 10px; } .ol-captionfont { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #f6f6f6; font-weight: bold; } .ol-captionfont a { color: #0B55C4; text-decoration: none; font-size: 12px; } /* spacers */ span.article_separator { display: none; } .article_column { padding-right: 5px; } .column_separator { border-left: 1px dashed #e0e0e0; padding-left: 10px; } td.buttonheading img { border: none; } .clr { clear: both; } td.greyline { width: 20px; background: url(../../../images/mw_line_grey.png) 50% 0 repeat-y; } div#maindivider { border-top: 1px solid #ddd; margin-bottom: 10px; overflow: hidden; height: 1px; } table.blog span.article_separator { display: none; } /* edit button */ .contentpaneopen_edit { float: left; } /* table of contents */ table.contenttoc { margin: 5px; border: 1px solid #ccc; padding: 5px; float: right; } table.contenttoc td { padding: 0 5px; } /* content tables */ td.sectiontableheader { background: #efefef; color: #333; font-weight: bold; padding: 4px; border-right: 1px solid #fff; } tr.sectiontableentry0 td, tr.sectiontableentry1 td, tr.sectiontableentry2 td { /*padding: 4px;*/ } td.sectiontableentry0, td.sectiontableentry1, td.sectiontableentry2 { /*padding: 3px;*/ } /* content styles */ table.contentpaneopen, table.contentpane { margin: 0; padding: 0; width: auto; } 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: Arial, Helvetica, 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 h3 { font-family: Helvetica, Arial, sans-serif; font-size: 12px; font-weight: bold; color: #eee; margin: -23px -4px 5px -5px; padding-left: 10px; padding-bottom: 2px; } div.module_menu { margin: 0; padding: 0; margin-bottom: 15px; } div.module_menu div div div { padding: 10px; padding-top: 30px; padding-bottom: 15px; width: auto; } div.module_menu div div div div { background: none; padding: 0; } div.module_menu ul { margin: 10px 0; padding-left: 20px; } div.module_menu ul li a:link, div.module_menu ul li a:visited { font-weight: bold; } #leftcolumn div.module { padding: 0 10px; } #leftcolumn div.module table { width: auto; } /* forms */ 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 { text-align: left; } form#form-login fieldset { border: 0 none; margin: 0; padding: 0.2em; } form#form-login ul { list-style-type: none; margin: 0; padding: 0; } form#form-login ul li { background-image: none; padding: 0; } #modlgn_username, #modlgn_passwd { width: 90%; } #form-login-username, #form-login-password, #form-login-remember { display: block; margin: 0; } form#com-form-login { text-align: left; } form#com-form-login fieldset { border: 0 none; margin: 0; padding: 0.2em; } form#com-form-login ul { list-style-type: none; margin: 0; padding: 0; } form#com-form-login ul li { background-image: none; padding: 0; } /* 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; } div.message { 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 */ .banneritem img { display: block; margin-left: auto; margin-right: auto; } /* Text advert style */ .banneritem_text { padding: 4px; font-size: 11px; } .bannerfooter_text { padding: 4px; font-size: 11px; background-color: #f7f7f7; text-align: right; } /* System Messages */ /* see system general.css */ .pagination span { padding: 2px; } .pagination a { padding: 2px; } /* Polls */ .pollstableborder { margin-top: 8px; } .pollstableborder td { text-align: left; } /* WebLinks */ span.description { display: block; padding-left: 30px; } /* 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 { margin-bottom: 20px; } #system-message dd.message ul { background: #c3d2e5 url(../../../system/../images/notice-info.png) 4px center no-repeat; border-top: 3px solid #de7a7b; border-bottom: 3px solid #de7a7b; margin:0px; padding-left: 40px; text-indent:0px; } /* System Error Messages */ #system-message dd.error ul { color: #c00; background: #e6c0c0 url(../../../system/../images/notice-alert.png) 4px center no-repeat; border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B; margin: 0px; padding-left: 40px; text-indent: 0px; } /* System Notice Messages */ #system-message dd.notice ul { color: #c00; background: #efe7b8 url(../../../system/../images/notice-note.png) 4px center no-repeat; border-top: 3px solid #f0dc7e; border-bottom: 3px solid #f0dc7e; margin: 0px; padding-left: 40px; text-indent: 0px; } #syndicate { float: left; padding-left: 25px; } /* Component Specific Fixes */ #component-contact table td { padding: 2px 0; } .breadcrumbs img { margin: 0px; padding: 0px; border: 0px; } .mceToolbarTop { white-space: normal; }
Beitrag zuletzt geändert: 24.6.2009 21:33:44 von stargate -
Hier eine geänderte superfish.css:
/*** ESSENTIAL STYLES ***/ .sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; } .sf-menu { line-height: 1.0; } .sf-menu ul { position: absolute; top: -999em; width: 10em; /* left offset of submenus need to match (see below) */ } .sf-menu ul li { width: 100%; } .sf-menu li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ } .sf-menu li { float: left; position: relative; } .sf-menu a { display: block; position: relative; } .sf-menu li:hover ul, .sf-menu li.sfHover ul { left: 0; top: 2.5em; /* match top ul list item height */ z-index: 99; } ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul { top: -999em; } ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul { left: 10em; /* match ul width */ top: 0; } ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul { top: -999em; } ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul { left: 10em; /* match ul width */ top: 0; } /*** DEMO SKIN ***/ .sf-menu { float: left; margin-bottom: 1em; } .sf-menu a { border: 1px solid #fff; padding: .75em 1em; text-decoration:none; } .sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/ color: #13a; } .sf-menu li { } .sf-menu li li { } .sf-menu li li li { } .sf-menu li:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { outline: 0; } .sf-menu li .separator { display: block; border-left: 1px solid #fff; border-top: 1px solid #CFDEFF; padding: .75em 1em; text-decoration:none; } /*** arrows **/ .sf-menu a.sf-with-ul { padding-right: 2.25em; min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */ } .sf-sub-indicator { position: absolute; display: block; right: .75em; top: 1.05em; /* IE6 only */ width: 10px; height: 10px; text-indent: -999em; overflow: hidden; background: url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */ } a > .sf-sub-indicator { /* give all except IE6 the correct values */ top: .8em; background-position: 0 -100px; /* use translucent arrow for modern browsers*/ } /* apply hovers to modern browsers */ a:focus > .sf-sub-indicator, a:hover > .sf-sub-indicator, a:active > .sf-sub-indicator, li:hover > a > .sf-sub-indicator, li.sfHover > a > .sf-sub-indicator { background-position: -10px -100px; /* arrow hovers for modern browsers*/ } /* point right for anchors in subs */ .sf-menu ul .sf-sub-indicator { background-position: -10px 0; } .sf-menu ul a > .sf-sub-indicator { background-position: 0 0; } /* apply hovers to modern browsers */ .sf-menu ul a:focus > .sf-sub-indicator, .sf-menu ul a:hover > .sf-sub-indicator, .sf-menu ul a:active > .sf-sub-indicator, .sf-menu ul li:hover > a > .sf-sub-indicator, .sf-menu ul li.sfHover > a > .sf-sub-indicator { background-position: -10px 0; /* arrow hovers for modern browsers*/ } /*** shadows for all but IE6 ***/ .sf-shadow ul { background: url('../images/shadow.png') no-repeat bottom right; padding: 0 8px 9px 0; -moz-border-radius-bottomleft: 17px; -moz-border-radius-topright: 17px; -webkit-border-top-right-radius: 17px; -webkit-border-bottom-left-radius: 17px; } .sf-shadow ul.sf-shadow-off { background: transparent; }
Beim Nachladen nicht vergessen, dass die Cache manchmal etwas braucht, F5 hilft im FF.
Beitrag zuletzt geändert: 24.6.2009 23:32:28 von werktags -
danke für deine bemühungen und danke, dass zu dir zeit genommen hast, aber das sieht leider nicht so aus, wie ich es mir vorgestellt habe
Hier ist ein screenshot vom menü, so wie es ausschauen sollte (nur eben vereint mit dem superfish menu)
http://img507.imageshack.us/img507/700/unbenanntdbj.jpg
-
Nunja, irgendwo hören auch meine Dienste auf und im glaskugeln bin ich auch nicht sehr gut
Damit musst du jetzt selbst zurecht kommen. Ich gebe dir lediglich ne kleine Anleitung:
1.) Lern CSS!
2.) Sicherlich ist dir aufgefallen, dass dein Wunsch Grafiken einsetzt, die ich und sonst kein anderer hat. Diese Grafiken sind der "background" der Links bei der akutellen (.current) Seite.
3.) Die Hintergrundfarbe der li weißt auch nur du!
4.) Die Links haben nur Großbuchstaben (uppercase).
Ich glaube aber auch, es wird Zeit, dass du mal lernst, dass nicht jeder dir hier alles machen kann. Ich mein immerhin hab ich mir die Mühe gemacht und deinen Quellcode auseinander genommen und auch eine Lösung gepostet. Und nicht zuletzt habe ich gleich am Anfang gesagt, dass es nichts bringt, wenn du nicht sagst, wie du es gern hättest. Und du sagst es erst jetzt!
Falls du es nicht selbst machen kannst/willst, such dir mal kompetente Hilfe und bezahle die auch dafür. Du kennst bestimmt jemanden aus dem Bekanntenkreis, der dir solche Kleinigkeiten lösen kann und dem du dann auch etwas Spenden kannst -
ok, ich hab die dateien, ausdenen das menü besteht
Diese werden irngendwie mit css code oder so zusammengehalten
http://stargate.lima-city.de/templates/designnew/images/item-left.png
http://stargate.lima-city.de/templates/designnew/images/item-right.png
http://stargate.lima-city.de/templates/designnew/images/Button.png
ich kenn mich da in diesem bereich leider nicht aus, hab auch schon gegoogelt aber nichts gefunden
Hoffe auf schnelle Hilfe -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage