Wie würde ich gehen, etwas zu tun wie auf diesem Bild?
Ich habe versucht, die li
hintergrund, Positionierung 1px
rechts und größer z-index
, aber ohne Erfolg.
Bekam ich auch die Idee zu geben, die Grenze zu den li
's und ausblenden der Grenze aktiv, aber ich muss die Grenze sein, solange die Inhalte auf der rechten Seite.
Folgende baut auf John ' s-Lösung und erweitert auch die Höhe des Rahmens entsprechend der Höhe des Inhalts.
HTML:
CSS:
Beispiel hier.
Können Sie dies tun...
So lange, wie das mit
ul
hatoverflow: hidden
.versuchen Sie eine dieser:
Ich erreichen, das Wirkung ich gebe jedem meiner Liste Elemente, die eine richtige Grenze, aber für das ausgewählte Listenelement ich die
border-color
weiß.Allerdings, wenn Sie wollen, die richtige Grenze zu erweitern, über die Liste Elemente, die Sie benötigen, um die Grenze auf der
ul
mit einer Höhe festlegen, und fügen Sie eine 1px negative Marge, um die Elemente der Liste.Beispielsweise dieser mark-up
Und diese CSS -
Wird dieses Ergebnis erzielen - http://jsfiddle.net/ajcw/3VMyY/
Ich denke, dass die sich überlappenden getan werden könnte, mit einem anderen div in li, mit position relative, nach rechts verschoben. Aber dann haben Sie zum ein - /ausblenden, basierend auf den ausgewählten Artikel.