Problem z rozwijanym menu

pytanie zadane 13 sierpnia 2018 w HTML i CSS przez Szymon hciećwiedzieć Początkujący (330 p.)

mam problem poniewaz iz gdyz button gdy menu jest zwinięte zmienia połozenie jak tego uniknąc ?

<nav>
        <ul>
            <button><i class="fas fa-bars"></i></button>
            <li class="li"><a href="#">Shen</a></li>
            <li class="li"><a href="#">Plays</a></li>
            <li class="li"><a href="#">Historia</a></li>
            <li class="li"><a href="#">Ranking</a></li>
        </ul>
    </nav>

 ul {position: absolute;
            top: 10%;
            left: 4%;
            z-index: 3;
            list-style-type: none;
            text-align: center;
        }

        a {
            text-decoration: none;
            color: blue;
            font-weight: bold;
            font-size: 2rem;
            text-shadow: 0 0 1rem yellow;
            font-family: 'Courgette', cursive;
            padding: .4rem;
        }

        li {
            border: 7px solid blue;
            border-radius: 15px;
            background-color: white;
        }

        button {
            display: contents;

        }

        .fa-bars {
            text-align: center ;
            font-size: 2rem;
            color: blue;

komentarz 13 sierpnia 2018 przez StOcK Mądrala (6,100 p.)

Na początek proponuję dodać przykład np na jsfiddle. Będzie łatwiej zrozumieć problem i pomóc.

komentarz 13 sierpnia 2018 przez shotokan Nałogowiec (39,660 p.)

Tak na marginesie w <ul> powinny być same <li> więc tego buttona daj poza ten znacznik.

komentarz 13 sierpnia 2018 przez Szymon hciećwiedzieć Początkujący (330 p.)

gdy buttona dam za zancznik menu przestaje działac

komentarz 13 sierpnia 2018 przez StOcK Mądrala (6,100 p.)

To widocznie musisz coś zmienić w skrypcie JS

komentarz 13 sierpnia 2018 przez Szymon hciećwiedzieć Początkujący (330 p.)

@StOcK, jak udostenic zapisany juz kod ?

komentarz 13 sierpnia 2018 przez shotokan Nałogowiec (39,660 p.)

To nie dotyczy Twojego problemu, ale zgodnie ze specyfikacją w ul mają być tylko li. W takim razie ujmij buttona w li.

komentarz 13 sierpnia 2018 przez Tomek Sochacki Ekspert (227,510 p.)

@Szymon hciećwiedzieć,

mam problem poniewaz iz gdyz button gdy menu jest zwinięte zmienia połozenie jak tego uniknąc

Ludzie... nosz kur.. mnie czasami bierze jak czytam te teksty dzisiejszych, młodych programistów. Tak ciężko napisać po polsku jedno zdanie?

Po drugie, button leci do wnętrza <li>, pisz zgodnie z zasadami HTML.

Po trzecie jak oczekujesz pomocy w takim kodzie to daj porządnego linka do codepen, podepnij w nim sam fontawesome (dlaczego każdy ma sam się w to bawić?).

komentarz 13 sierpnia 2018 przez StOcK Mądrala (6,100 p.)

@Szymon hciećwiedzieć,

Np tutaj: http://jsfiddle.net/ wymagane pliki (css, js) html, css, js i wrzuć tutaj link

komentarz 13 sierpnia 2018 przez Szymon hciećwiedzieć Początkujący (330 p.)

wrzuciłem.Ale jak udostępnić ?

komentarz 13 sierpnia 2018 przez Szymon hciećwiedzieć Początkujący (330 p.)

Dobra nie ważne dałem rade.Gdy wyciągnąłem buttona z ul wpadłem na inny pomysł w rozporządzeniu kodem. I jak wcześniej miałem tego buttona z fontawsome nad li po środku to teraz jest nad li z przerwą od prawej strony i nie zmienia położenia.