Member 13124828 Ответов: 2

Автоматическое изменение размера моего списка меню CSS HTML

когда я получаю курсор на кнопку "GOOGLE", размер блока для него сам по себе я хочу, чтобы элемент внука находился вне кнопки parrent.

КОД:

<html>
<head>
   <style type="text/css">
       
       ol{
           display: none;
       }
       li:hover ol 
       {
           display: block;
           margin-left: -4.2em;
       }
       #shadow li 
       { list-style-type: none;
       border: 2px solid black;
       box-shadow : 5px 5px 5px gray;
       margin-bottom: 10px;
       text-align: center;
       width: 10em;
       margin-left: 1.5em;
       float : left;
           display: block;


       }
       
</style>
    </head>
<body>
    <div id="shadow">
    <ul>
        <li style="margin-left : -2.5em"> 
            <a href="http://www.google.com">GOOGLE</a>
            <ol type="a"> 
        <li> <a href="http://www.google.com">google1</a>
        </li> 
        <li> <a href="http://www.google.com">google1</a>
        </li>

  
            </ol>
        
      
        </li>
        
        <li> <a href="http://www.youtube.com">YOUTUBE</a></li>
        
        <li> <a href="http://www.facebook.com">FACEBOOK</a></li>
        </ul>
    
  
    </div>
   
</body>
</html>


Что я уже пробовал:

у меня были некоторые изменения в моем коде но я ничего не получил

2 Ответов

Рейтинг:
2

san2debug

Привет,

вы можете перейти по этой ссылке

Автоматическое изменение размера списка меню CSS HTML - Stack Overflow[^]

Рейтинг:
0

Karthik_Mahalingam

добавить это

#shadow ol li {
           list-style-type: none;
           border: 2px solid black;
           box-shadow: 5px 5px 5px gray;
           margin-bottom: 10px;
           text-align: center;
           width: 9em;
           margin-left: 1.9em;
           float: left;
           display: block;
       }