Ширина нижней границы

Border bottom width

Для того чтобы задать толщину нижней границы элемента применяется свойство border-bottom-width. В качестве параметра может использоваться цифровое значение, слова – thin, medium, thick и наследование.


border-bottom-width: 30px;
border-bottom-width: thin;
border-bottom-width: medium;
border-bottom-width: thick;
border-bottom-width: inherit;

30px – толщина нижней границы 30 пикселей

thin – толщина границы 2 пиксела

medium – толщина 4 пиксела

thick – 6 пикселов

inherit – наследует значение родителя

Ширина границы снизу 

HTML

<div class="note">
  <h3>border-bottom-width</h3>
  <p class="mark">border-bottom-width: 30px;</p>
  <p>border-bottom-style: solid;</p>
  <p>border-bottom-color: red;</p>
</div>



CSS

h3{
    color: #444;
    font-size: 24px;
    padding-bottom: 14px;
}
p{
    margin: 4px 0px;
    font-size: 22px;
}
.mark{
    color: #fff;
    padding: 4px;
    background-color: #777;
}
.note{
    display: table;
    margin: 50px auto;
    padding: 10px 40px;
    letter-spacing: 1.5px;
    background-color: #fC0;
    border-bottom-width: 30px;
    border-bottom-style: solid;
    border-bottom-color: red;
}