CSS Menu Hintergrund Farbe Änderung nur für ein bestimmter Bereich

[dota2hook]

Hey Leute, auf folgender Seite: http://www.newsocialdynamics.de/ will ich da wo "Member Area" steht, bis zum Menu-Rand gelb färben.

Das erste was ich versucht habe, war durch der Width Eigenschaft, nur dass Problem dabei war, dass der Button dann Rechteckig war und nciht zum Menu gepasst hat.

Habt ihr eine IDee, wie ich das am besten machen könnte?

Danke schon im VOraus,

LG philip

 

[Adam Gontier]

So?



[url ]http://www.newsocialdynamics.de/wp-content/w3tc/min/bfc7fa6a.510f9a.css[/url]

.navigation.main{
    -moz-linear-gradient(center top , #FDC635, #FDD66E 19px, #FDC635 19px, #FDC635);
}

 

[Tumbleweed]

Gib dem letzten Listenelement

width: 134px;
border-radius: 0px 9px 9px 0px;

Ist aber alles ziemlich hacky, es sei denn das Menü wird sich niemals ändern und auch nicht lokalisiert.

 

[Adam Gontier]

Ach das war gemeint.

Dann am besten so:

ul#nav li:last-child {
    width: 134px;
    border-radius: 0 9px 9px 0;
}

Übrigens kommt man bei dem Menü Person nicht auf den Punkt Warum ich tue, was ich tue.

 

[Tumbleweed]

IE8 und abwärts unterstützt das leider nicht. Zur Not mit jQuery nachhelfen oder eben direkt per id ansprechen. Hat ja erstaunlicherweise jedes Element eine id.

Oder auf IE scheißen. Ist auch legitim.

 

[dota2hook]

Das hat super funktioniert, danke!

ul#nav li:last-child {
width: 134px;
border-radius: 0 9px 9px 0;
}

Ergänzung (30. September 2012)

Hmm, anscheinend hat es an einem Mac mit FIrefox nicht ganz gepasst:



ps. Jetzt ist der Rand links rechteckig, und nicht mehr Rund wie es im Moment rechts ist. Kann man eben auf beiden Enden ein runden Rand hinkriegen?

 

[UnKnOwN_86]

Du könntest jedem Element seine eigene Hintergrund farbe verpassen, dann mit :first-child und :last-child die Rundungen machen.

 

[dota2hook]

Ok, ich glaub ich habe herausgefunden an was es liegt. Wegen dem Scalieren der Webseite. Sprich Strg+Mauserad, zoomen.

;(

Ergänzung (30. September 2012)

Du könntest jedem Element seine eigene Hintergrund farbe verpassen, dann mit :first-child und :last-child die Rundungen machen.

Wie genau wird eine Rundung gemacht? Bzw. wo wird das in meinem Code getan.

*Sorry für die Noob-Fragen

 

[UnKnOwN_86]

border-radius: 0 9px 9px 0;

macht runde ecken. Siehe dazu: http://www.w3schools.com/cssref/css3_pr_border-radius.asp

 

[dota2hook]

So jetzt habe ich es durch float:right geschaft. Ist es aber möglich, den gesamtem letzten bereich auszufüllen? Also von Kontakt bis Member Area?

Danke!