HTMl 5 i CSS 3 - Pomoże mi ktoś problem z wysuwanym menu

pytanie zadane 6 lipca 2018 w HTML i CSS przez niezalogowany
zmienione kategorie 6 lipca 2018 przez Arkadiusz Waluk

Zaczynam dopiero z programowaniem i chciałem zrobić menu wysuwane ale nei wiem jak zrobić żeby wyświetlał się tekst po rozwinięciu a przed był niewidoczny. Zmieniłem kod tak lepiej ?

Mój kod HTML5:

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="style.css">

<body>

<div id="mySidenav" class="sidenav">
  <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
  <a href="#">1</a>
  <a href="#">2</a>
  <a href="#">3</a>
  <a href="#">4</a>
</div>

<script>
function openNav() {
    document.getElementById("mySidenav").style.width = "100%";
}

function closeNav() {
    document.getElementById("mySidenav").style.width = "0";
}
</script>
     
</body>
</html>

Mój kod CSS3:

body {
    font-family: "Lato", sans-serif;
}
.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #111;
    overflow-x: hidden;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    padding-top: 60px;
    text-align:center;
}

.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #818181;
    display: block;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    overflow: hidden;
}

.sidenav a:hover{
    color: #f1f1f1;
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
}

komentarz 6 lipca 2018 przez Shaoi Mądrala (7,020 p.)

Kod wstawiamy o odpowiednie bloczki kodu.

Swoją drogą gdzie tutaj zastosowane jest HTML5?

komentarz 6 lipca 2018 przez niezalogowany
przeniesione 6 lipca 2018 przez Arkadiusz Waluk

W sensie main, footer itp?

komentarz 6 lipca 2018 przez Mariusz08 Maniak (62,280 p.)

Zła kategoria

komentarz 6 lipca 2018 przez Shaoi Mądrala (7,020 p.)
edycja 6 lipca 2018 przez Shaoi

Proszę swoją odpowiedź przenieść jako komentarz.

Odpowiadając na pytanie - po części tak, natomiast div.nav powinno być nav.nav.

Co do kodu CSS, nie stylizuje się po tagach.

Kolejnym, dość poważnym błędem jest język strony. Ustawiłeś, ze strona będzie w języku angielskim, nawet title strony jest po angielsku, zaś zawartość strony jest w języku polskim.