Jak w HTML zaokrąglić meni???

Question

Witam

Chciałbym zaokrąglić meni po bokach. Za pomoc z góry dziękuje.

HTML
<nav>
            <a class="menu active" href="index.html">Strona główna</a>
            <a class="menu" href="" >Zasady pisowni</a>
            <a class"menu" href="">Dyktanda</a>
            <a class"menu" Href="">Kontakt</a>
 </nav>

CSS
nav a {
    display: block;
    width: 25%;
    float: left;
    color: white;
    text-align: center;
    text-decoration: none;
    background-color: cadetblue;
    padding: 15px 30px;
    font-size: 20px;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}

nav a:hover {
    background-color:skyblue;
    cursor: pointer;
}

Answer 1

Do zaokrąglania boków służy border-radius

Comments

A działa to też przy tej lini podkreślającej?

---

taką linię robi się albo poprzez border-bottom, albo poprzez selektor :after i tam ustawia się witdh, height i background-color. Do obu tych sposobów możesz dodać border-radius i zaokrągli ;)

Chyba, że to jakieś '<hr>' czy inne cuda to nie wiem

---

Dzięki