Верхняя граница

С помощью свойства border-top можно одновременно отрегулировать отображение необходимой толщины, характерного стиля и желаемого цвета границы вверху элемента. Значения свойства border-top пишутся через пробел в одной строке в свободном порядке.


border-bottom: thick solid #fff;

thick – толщина границы шесть пикселей

solid – используется сплошная линия

#fff – белый цвет границы


HTML

<div class="menu-block">
  <h3>border-top: thick solid #fff;</h3>
    <ul>
      <li><a href="#">border-top-width: thick;</a></li>
      <li><a href="#">border-top-style: solid;</a></li>
      <li><a href="#">border-top-color: #fff;</a></li>
    </ul>
  <h3>border-bottom: thick solid #fff;</h3>
    <ul>
      <li><a href="#">border-bottom-width: thick;</a></li>
      <li><a href="#">border-bottom-style: solid;</a></li>
      <li><a href="#">border-bottom-color: #fff;</a></li>
    </ul>
</div>


CSS

.menu-block{
    display: table;
    margin: 0px auto;
    letter-spacing: 1.5px;
}
.menu-block a:link{
    color: #369;
    text-decoration: none;
}
.menu-block h3 {
    color: #fff;
    padding: 14px;
    background: olive;
    border-top: thick solid #fff;
    border-bottom: thick solid #fff;
}
.menu-block ul {
    color: olive;
    font-size: 20px;
    line-height: 30px;
    padding-top: 15px;    
    padding-left: 30px;
    padding-bottom: 15px;
    background-color: #e1e1e1;
}