Как сверстать пронумерованный список с ховером на всю ширину экрана?

Question

[evlgromov]

Надо вот так. Спасибо.

Answer 1

[Ankhena]

Например, так https://jsfiddle.net/vctrLpya/

Answer 2

[dobryy_drug]

попробуй типо:

<div class="item">
<div class="item-wrap">
/* CONTENT */
</div>
</div>

Где item будет как раз таки весь этот прямоугольник на всю ширину (к нему потом hover добавить можешь), а item-wrap это будет обертка, внутри которой будет содержимое (соответственно ему нужно будет задать ширину и выравнивание:

max-width: 500px;
width:100%;
margin:0 auto

Вот пример в песочнице

Answer 3

[VegasChickiChicki]

Сделайте список ol, в него положите li. Ol - 100% ширина, li - 100% ширина + нужные отступы. В чем проблема?
"Как сверстать пронумерованный список с ховером на всю ширину экрана?" - сверстать нумерованный список с ховером во всю ширину экрана, какой ответ вы хотите услышать? Хотите увидеть пример кода? Так это вам на Фрилансим с заявкой...

Comments

[evlgromov]

У меня примерно так и есть на данный момент.

[VegasChickiChicki]

evlgromov, Значит не так. Задайте ширину контейнеру в котором лежит список 100%, ширину списка 100%, ширину айтемов списка.