-1

これがフィドルです

<li>最初に、隣接する要素の境界線に重なる境界線を設定しようとしています - これは、対応するメニュー項目が現在選択されているときに境界線のセクションを非表示にするために使用されます (暗い境界線に重なる白い境界線を表示することによって) .

CSS:

.side-study-box .side-box-menu .nav-selected {
    /* Works, but I need it to overlap the black border on the right */
    border-right: 2px red inset;
    /* Does not show the border because it's hidden */
    border-right: 2px red; /* Works */
    z-index: 101;
}

これが私のコードです：

<div class="viewport">
    <ul>
        <li> <a class="side-box-menu-control nav-text" data-bind="css: { 'nav-selected': true }"><i class="icon-pencil"></i></a>
        </li>
        <li> <a class="side-box-menu-control nav-picture"><i class="icon-picture"></i></a>
        </li>
        <li> <a class="side-box-menu-control nav-video"><i class="icon-facetime-video"></i></a>
        </li>
    </ul>
</div>
4

1 に答える 1

1

次のようなことを試すことができます (border-type を に設定solid):

.side-study-box .side-box-menu .nav-selected {
    width: 22px;
    border-right: 3px red solid;
}

jsfiddle

于 2013-06-03T20:35:01.697 に答える