Ich bin gerade dabei mein erstes Design zu coden (Wirklich Komplett, wBB zählt da nich) und verzweifle an folgendem Problem:
a.menuelement:hover {
padding-top: 13px;
padding-right: 5px;
padding-left: 5px;
height: 36px;
background-image: url(img/element.png);
background-repeat: repeat-x;
background-position: center;
-webkit-border-radius: 20px !important;
-moz-border-radius: 20px !important;
border-radius: 20px !important;
}
Das ist der Code den ich benutze, die Ecken sollen abgerundet sein aber es sieht so aus: [attachment=842]
//EDIT Fehler gefunden, aber er rundet mir nun die Seiten ab und nicht die Ecken
Der Hintergrund soll flexibel sein
Willst du die Ecken abgerundet haben oder komplett rund, so das es ein Kreis wird?
Wieso hat denn dein Button ein Hintergrundbild? Soll das etwa abgerundet werden?
Dann wird es wohl daran liegen. Du solltest dem ganzen eine Hintergrundfarbe geben und kein Bild, dann sollte es gehen.
Und an ccoding: Bilder benötigen viel mehr Performance als normaler Code. Deshalb gibt es ja nun seit CSS3 diese Möglichkeit.
P.S.
statt
padding-top: 13px;
padding-right: 5px;
padding-left: 5px;
kannst du auch einfach
padding: 13px 5px 0 5px
schreiben
Also:
Es sollen nur die einzelnen Ecken abgerundet werden. Das Eine Farbe reicht nicht da das ja ein Verlauf plus Schatten ist. Er braucht ein Hintergrundbild weil das der hover Effekt sein soll. Und ich habe gelesen dass es auch mit bild geht.
Und danke für den Tipp mit dem Padding, aber ich habe es so gemacht dass ich immer sofort weis welcher Wert für was steht.
Weißt du doch auch so ? Padding: oben rechts unten links wie im Uhrzeigersinn
Dann google doch einfach mal, bin mir sicher, dass du viele Lösungen finden wirst.
Kann mir aber auch vorstellen, dass du den Repeat wegmachen solltest, oder es mal ohne Padding versuchen.
Beides ist leider nötig
Habs schon probiert