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

Question

[Norum]

Как сделать так, чтобы черта под текстом занимала всю длину сайдбара и как сделать такой же отступ от текста?
https://jsfiddle.net/Norum87/dfwtr4vz/1/

вот что получилось у меня

а вот как надо

Comments

[HamSter]

.menu-main ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.menu-main ul li a {
  display: block;
  text-decoration: none;
  border-bottom: 1px solid #fff;
  text-transform: uppercase;
  color: #fff;
  padding: 10px 20px;
}

[Norum]

Леонид, не работает

[Norum]

HamSter, не работает

[HamSter]

Norum, что именно не работает? И что Вы конкретно хотите, чтобы сайдбар был полностью у левого края, так у вас же еще и wrap.

Answer 1

[Aetae]

Элемент сделать блочным, отступ padding'ом, подчёркивание border'ом.

Comments

[Norum]

сделал элемент блочным, но у меня отступ слева и дальше линия не идет, а если его отменить, все съедет

[Aetae]

Norum, отмени margin-left, добавь padding-left.

[Norum]

Aetae, паддинг лефт ничего не даст,только сдвинет влево. Линии то останутся на месте

Answer 2

[wasiliev96]

Подчеркивание идет на всю длинну ссылки. Или делаете ссылку блочным элементом и пляшете отсюда дальше, или в ссылку засовываете блок, который весь и будет ссылкой.