Dlaczego kontent znika -css

0

https://jsfiddle.net/dhv8ruLy/
Dlaczego jeśli najade na link 'Info', to zawrtość się pojawia i znika?
i dlaczego zamiana elemtu:

.links:after{
    clear: both;
    content: "";
    display: block;
}

na

.dropdown:before{
    clear: both;
    content: "";
    display: block;
}

nie pwodouje takiego samego efektu? czyli przejscia linku 'Info' do nowej linii

0

Co do pierwszego problemu - brakuje ci czegoś takiego:

.dropdown-content:hover {
  display: grid;
}

Ustawiłeś hover na

.dropdown-button

ale gdy przejedziesz myszką na ten pojawiający się div to znika hover z tego przycisku przez co znika to okienko.

0

no i właśnie tego nie rozumiem, jak zamienie na taką linię:

.dropdown:hover > .dropdown-content{
    display: grid;
}

to działa, .... to by znaczyło że po najechaniu na element dropdown zamieniam dropdwon-content na grid, no i spoko, ale przcież jak przejadę na ten dropdown-content to nie 'hoveruje' już dropdown, więc też powinno 'zniknąć' hyyym?

Dlaczego dostaje błąd niedomknięcia } ? poniżej
https://jsfiddle.net/dhv8ruLy/35/

0

Dlaczego jeśli najade na link 'Info', to zawrtość się pojawia i znika?

Czego zawartość się pojawia, a czego znika? Na pewno chodzi o zawartość?

0
Silv napisał(a):

Dlaczego jeśli najade na link 'Info', to zawrtość się pojawia i znika?

Czego zawartość się pojawia, a czego znika? Na pewno chodzi o zawartość?

no nie, chodzi o to, dlazego to nie znika:
oto działająca linijka:

.dropdown:hover > .dropdown-content{
    display: grid;
}

Konstrukcja elemnt > element oznacza że Selects all

elements that are placed immediately after

elements
i tak, najadę na 'dropdown' wyświetla się zawartość 'dropdown-content', i schodze w dół na 'dropdown-content' i mnie zastatnwaia dlaczego ta zawartość nie znika.
Przecież już nie jestem na elemncie 'dropdown' więc warunek '.dropdown:hover' nie jest spełniony.</p>
1

Jesteś cały czas na elemencie dropdown – to znaczy, na jego zawartości. Każdy link <a> umieszczony w tym elemencie jest jego zawartością, a więc u ciebie elementy <a>one</a> itd. należą do elementu dropdown.

Pamiętaj, że selektor > (ew. tzw. combinator) powoduje wybranie wszystkich bezpośrednich potomków wraz z ich zawartością (czyli np. całym skomplikowanym menu, jeśli takie się stworzy).

1 użytkowników online, w tym zalogowanych: 0, gości: 1