# Hauptmenü letzter Menüpunkt - border-right wie löschen

**URL:** https://forum.shopware.com/t/hauptmenu-letzter-menupunkt-border-right-wie-loschen/28768
**Category:** Themes & Design
**Created:** [9. Juli 2015 um 11:50 UTC](https://forum.shopware.com/t/hauptmenu-letzter-menupunkt-border-right-wie-loschen/28768 "2015-07-09T11:50:28Z")
**Posts on this page:** 8
**Page:** 1

<div class="post-metadata">

### Author: ![shopmax](https://avatars.discourse-cdn.com/v4/letter/s/59ef9b/32.png) [@shopmax](https://forum.shopware.com/u/shopmax)
#### Post date: [9. Juli 2015 um 11:50 UTC](https://forum.shopware.com/t/hauptmenu-letzter-menupunkt-border-right-wie-loschen/28768/1 "2015-07-09T11:50:28Z")

</div>

Hallo, ich habe in meinem Hauptmenü die einzelnen Menüpunkte über einen border-right-wert im .navigation–link Bereich in der main-navigation.less getrennt (siehe unten). Es soll jedoch vor dem ersten und nach dem letzten Punkt keine Vertikalstrich zu sehen sein. Theoretisch weiss ich, dass das über ein last-child-element mit display:none gemacht wird, aber trotz langem probieren finde ich nicht raus, wie ich das bezüglich des .navigation–link Bereich einsetzen kann. Es wäre sehr nett, wenn mir jemand den passenden Code verraten könnte, dass nach dem letzten Menüpunkt keine border-right erscheint. Hier der aktuelle Code der main-navigation.less meines Themes: ` @media screen and (min-width: @tabletViewportWidth) { .navigation-main { .navigation--link {border-right: 1px solid white;} } } ` Herzlichen Dank.

---

<div class="post-metadata">

### Author: ![Shopwareianer](https://avatars.discourse-cdn.com/v4/letter/s/b4bc9f/32.png) [@Shopwareianer](https://forum.shopware.com/u/Shopwareianer)
#### Post date: [9. Juli 2015 um 11:55 UTC](https://forum.shopware.com/t/hauptmenu-letzter-menupunkt-border-right-wie-loschen/28768/2 "2015-07-09T11:55:48Z")

</div>

```auto
@media screen and (min-width: @tabletViewportWidth) { .navigation-main { .navigation--link { border-right: 1px solid white; &:last-child { border-right:none; } } } } 
```

---

<div class="post-metadata">

### Author: ![Neox](https://avatars.discourse-cdn.com/v4/letter/n/b5a626/32.png) [@Neox](https://forum.shopware.com/u/Neox)
#### Post date: [9. Juli 2015 um 11:57 UTC](https://forum.shopware.com/t/hauptmenu-letzter-menupunkt-border-right-wie-loschen/28768/3 "2015-07-09T11:57:44Z")

</div>

> [@shopmax](#):
>
> ` @media screen and (min-width: @tabletViewportWidth) { .navigation-main { .navigation--link {border-right: 1px solid white;} } } `

---

<div class="post-metadata">

### Author: ![Shopwareianer](https://avatars.discourse-cdn.com/v4/letter/s/b4bc9f/32.png) [@Shopwareianer](https://forum.shopware.com/u/Shopwareianer)
#### Post date: [9. Juli 2015 um 11:59 UTC](https://forum.shopware.com/t/hauptmenu-letzter-menupunkt-border-right-wie-loschen/28768/4 "2015-07-09T11:59:12Z")

</div>

[quote=“Neoxx”][quote=“shopmax”] ` @media screen and (min-width: @tabletViewportWidth) { .navigation-main { .navigation--link {border-right: 1px solid white;} } } ` [/quote] ganz einfach: ` @media screen and (min-width: @tabletViewportWidth) { .navigation-main { .navigation--link:last-child {border-right: none;} } } ` Ist hier erklärt wie das ganze funktioniert mit den childs 🙂 [http://www.elmastudio.de/programmierung … nth-child/](http://www.elmastudio.de/programmierung/css/css-tipps-die-css-pseudoklassen-selektoren-first-child-last-child-und-nth-child/)[/quote] An sich richtig - Allerdings sollte man natürlich schon dem LESS Standard folgen 🙂 Demnach &:last-child { … wie oben geschrieben :x

---

<div class="post-metadata">

### Author: ![Neox](https://avatars.discourse-cdn.com/v4/letter/n/b5a626/32.png) [@Neox](https://forum.shopware.com/u/Neox)
#### Post date: [9. Juli 2015 um 12:00 UTC](https://forum.shopware.com/t/hauptmenu-letzter-menupunkt-border-right-wie-loschen/28768/5 "2015-07-09T12:00:17Z")

</div>

[quote=“kayyy”] An sich richtig - Allerdings sollte man natürlich schon dem LESS Standard folgen 🙂 Demnach &:last-child { … wie oben geschrieben :x[/quote] Da hast du recht. 😃

---

<div class="post-metadata">

### Author: ![shopmax](https://avatars.discourse-cdn.com/v4/letter/s/59ef9b/32.png) [@shopmax](https://forum.shopware.com/u/shopmax)
#### Post date: [9. Juli 2015 um 13:34 UTC](https://forum.shopware.com/t/hauptmenu-letzter-menupunkt-border-right-wie-loschen/28768/6 "2015-07-09T13:34:26Z")

</div>

Hallo kayyy, hallo Neoxx, vielen Dank für Eure rasche Antwort. Ich habe beide Lösungen ausprobiert. Leider ist es so, dass jetzt gar keine border-right der navigation–link mehr angezeigt wird. Irgendwie wird die last child Logik nicht angewendet. So sieht es auch im Firebug aus. Danke

---

<div class="post-metadata">

### Author: ![Shopwareianer](https://avatars.discourse-cdn.com/v4/letter/s/b4bc9f/32.png) [@Shopwareianer](https://forum.shopware.com/u/Shopwareianer)
#### Post date: [9. Juli 2015 um 13:54 UTC](https://forum.shopware.com/t/hauptmenu-letzter-menupunkt-border-right-wie-loschen/28768/7 "2015-07-09T13:54:19Z")

</div>

Ja das liegt daran, dass es innerhalb des Elements auch nur ein Kind Element gibt. Es müsste also lauten wie etwa: `@media screen and (min-width: @tabletViewportWidth) { .navigation-main { .navigation--entry { border-right: 1px solid white; &:last-child { border-right:none; } } } } ` So wird direkt das li Element angesprochen und dem letzen li dann kein Border zugewiesen. Möchtest du das ganze direkt dem a Element geben wäre es `@media screen and (min-width: @tabletViewportWidth) { .navigation-main { .navigation--entry { .navigation--link { border-right: 1px solid white; } &:last-child { .navigation--link { border-right: none; } } } } } `

---

<div class="post-metadata">

### Author: ![shopmax](https://avatars.discourse-cdn.com/v4/letter/s/59ef9b/32.png) [@shopmax](https://forum.shopware.com/u/shopmax)
#### Post date: [9. Juli 2015 um 14:01 UTC](https://forum.shopware.com/t/hauptmenu-letzter-menupunkt-border-right-wie-loschen/28768/8 "2015-07-09T14:01:16Z")

</div>

Fantastisch, jetzt funktioniert´s. Herzlichen Dank für Deine Hilfe und auch Deine Erklärungen. Ich freue mich immer über ein „Dazulernen“.
