Как релизовать такую рамку чтобы сохранилась адаптивность?

Question

[hoffman7075]

Привет! Всегда, когда появляются такие задачи, возникают сложности с реализацией. Какие идеи есть насчет этого?

<nav class="header-nav">
        <ul>
          <li><a href="#banner">Главная</a></li>
          <li><a href="#about">О технологии</a></li>
          <li><a href="#how-we-work">Как мы это делаем</a></li>
          <li><a href="#goods-offers">Цены и продукция</a></li>
          <li><a href="#reviews">Отзывы</a></li>
        </ul>
</nav>

Answer 1

[Alexandr59]

Надо сделать второй div с {border: 1px solid #цвет} и задать всем position.
Чтобы были друг над другом.
Вот примерно https://jsfiddle.net/Mesuti/dbvpL46n/3/

Comments

[hoffman7075]

за идею спасибо. уже почти сделал!

[Alexandr59]

hoffman7075, Еще к тексту применить выделение в цвет фона, так рамка не будет пересекатся с буквами

Answer 2

[Апатий Черный]

Смотря как он должен выглядеть в моб. версии