CSS Problem

omc

Legendäres Mitglied
Hallo zusammen

ich dreh mich mit einem CSS total im Kreis, sehe nicht wo der Fehler ist.

Es geht um dieses Template:
http://blog.omc.ch/em/

Das blau könnt Ihr Euch wegdenken, steht nur da, damit ich DIV Box hinten, und die Veränderung sehe.

Es geht um die Buttons oben (Home, Qualifikation etc.)
Bei diesen Button soll der Text von oben ein Padding von 10 Pixel haben. Nur der Text, die BG Bilder müssen oben bleiben.

Versucht habe ich es so:
CODE #menu {
clear: both;
width: 728px;
color: #000000;
height: 26px;
padding: 0;
margin: 0;
}

#menu ul {
padding: 0;
margin: 0;
}

#menu li {
float:left;
background-image: url(../images/navi_weiss.gif);
background-repeat: no-repeat;
height: 26px;
width: 130px;
background-position: left;
text-align: center;
overflow: hidden;
list-style-type: none;
}
#menu li a,
#menu li a:link,
#menu li a:visited {
list-style-type: none;
font-weight: bold;
color: #009933;
font-size: 12px;

}


und auf viele andere Arten, funktioniert aber nicht. Sobald ich bei
#menu li oder #menu li a ein Padding-Top von 10 mache, schiebt es mir die ganzen Buttons runter.

Hat mir jemand einen guten Tip ?

Das ganze CSS gibts hier: http://blog.omc.ch/em/css/cms.css
Den Quellcode via Browser ;-) hier: http://blog.omc.ch/em/

Danke schon im Voraus, für Tipps und Hilfe

Ric
 
Hast Du mal probiert das Image in "menu li a" reinzumachen?

Nachtrag

Quak das war wohl nix, aber schau mal auf unserer mallorcaseite, da haben wir das backgroundimage in einen anderen div rein.
 
ja habe ich probiert, leider mit dem selben result wie wenn ich es bei #menu li reinmach.

ric
 
Kann es nicht sicher sagen, aber aus meiner Erfahrung hat es meist mit
float
zu tun. Hier solltest Du ansetzen.
LG
Jim
 
versuch mal

#menu a{
position:relative;
top:12px;
}

oder auch

#menu ul li a{
position:relative;
top:12px;
}
 
CODE

ul, li {
padding : 0;
margin : 0;
}

#menu li {
padding:10px 0 0 0;
float:left;
background-image: url(../images/navi_weiss.gif);
background-repeat: no-repeat;
height: 16px;
width: 130px;
background-position: left;
text-align: center;
overflow: hidden;
list-style-type: none;
}

 
CODE

#menu li {
float:left;
background-image: url(../images/navi_weiss.gif);
background-repeat: no-repeat;
height: 26px;
width: 130px;
background-position: left;
text-align: center;
overflow: hidden;
list-style-type: none;

margin: 10px 0px 0px 0px;
}


 
QUOTE (Duvi @ Di 10.07.2007, 11:49) versuch mal

#menu a{
position:relative;
top:12px;
}

oder auch

#menu ul li a{
position:relative;
top:12px;
}

wow DANKE, der wars. uffffff

Ric
 
Zurück
Oben