• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Menu się zlewa z hoverem

VPS Starter Arubacloud
0 głosów
368 wizyt
pytanie zadane 20 maja 2018 w HTML i CSS przez Kurab188 Nowicjusz (210 p.)
edycja 20 maja 2018 przez Kurab188

Złe działanie menu:
https://zapodaj.net/319a4f1790e35.png.html


Po najechaniu myszy, " Historia ", nie jest jednym blokiem, tak jak pozostałe, nwm dlaczego się tak dzieje.
Dodam, iż usuwam ten obrazek i zmieniam na nazwę, dopiero wtedy stwarza się blok " Historii ". 
Zlewa mi to się z tym obrazkiem a tak nie powinno być.
 

a {
    text-decoration: none !important;
}
 
#menu {
    float:right;
    margin-top:0;
    margin-right:30px;
    height:80px;
    width:80px;
}
 
ol {
  list-style-type:none;
  padding:0;
  font-size:22px;
  height:2em;
  line-height:2em;
  text-align:center;
  float:right;
  margin-top:0;
  color:black;
}
 
ol a {
  display:block;
  color:#000;
  text-decoration:none;
  padding:0 5px;
}
       
ol > li {
  float:right;
  background-color:white;
  width:150px;
  margin-left:1px;
}
 
ol > li > ul {
  list-style-type:none;
  padding:0;
  margin:0;
  display:none;
}
 
 
ol > li:hover > ul {
  display:block;
}
 
 ol a:hover {
   color:#FF99FF;
}
 
ol > li > ul > li {
   font-size:20px;
   border-style: outset;
}
 
ol > li > ul > li:hover {
    background-color: grey;
}
<body>
             
       <section>
               
       <nav>
       
       <div id="naglowek">
       
           
            <a href="index2.html">
           
                <div id="logo">
                   
                    <img id="icon" src="img\logo\logo.png"/>
                    <div id="icon"></div>                          
                    <span id="logo-text">Izba Regionalna</span>
                    <div id="logo-text2">w Starzynie</div>
                   
               
                </div>
               
            </a>
           
          <ol>
         
               <li><img id="menu" src="img\menu\menu.png">
               
                <ul>                                 
                 <li><a href="#Historia">Historia Izby</a></li>
                 <li><a href="#Informacje">Informacje</a></li>               
                 <li><a href="#Założycielka">Ekspozycje<a/></li>
                 <li><a href="#Zdjęcia">Ciekawostki</a></li>
                 <li><a href="#Ciekawostki">Patron<a/></li>          
                 <li><a href="#Szkoła">Szkoła</a></li>
                </ul>
               
              </li>
                     
           </ol>
           
       
         </div>    
       
       </nav>

 

komentarz 20 maja 2018 przez pablop76 VIP (123,180 p.)
Wstaw kod w odpowiednie bloczki na forum, będzie łatwiej i szybciej podejrzeć.

1 odpowiedź

+1 głos
odpowiedź 20 maja 2018 przez PolYGlok Pasjonat (19,450 p.)

#menu {

    float:right;

Usuń i wystarczy. 

Podobne pytania

0 głosów
1 odpowiedź 143 wizyt
pytanie zadane 18 czerwca 2016 w HTML i CSS przez nielotweb Bywalec (2,240 p.)
0 głosów
2 odpowiedzi 176 wizyt
pytanie zadane 10 października 2019 w HTML i CSS przez Hubert91 Nowicjusz (220 p.)
0 głosów
2 odpowiedzi 198 wizyt

92,775 zapytań

141,703 odpowiedzi

320,571 komentarzy

62,110 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...