0

This is my menu here

I want to do like this here

.containermenu ul  li{
    text-decoration: none;
    list-style: none;
    float: left;
    
}

.containermenu ul li a {
    text-decoration: none !important;
}

.containermenu ul li ul li {
    float: none;
    margin: 0.7rem;
}
 <div class="containermenu red topBotomBordersOut">
 
<ul>
<li> <a href="#">ANASAYFA</a> </li> 

<li> <a href="#">KURUMSAL</a>
     <ul>
         <li><a href="#">HAKKIMIZDA</a> </li>
         <li><a href="#">BIZ KIMIZ?</a> </li>  
     </ul>
  
</li> 

 <li> <a href="#">HİZMETLER</a> </li> 
 
 <li> <a href="#">KADROMUZ</a> </li> 
 
 <li> <a href="#">İLETİŞİM</a> </li> 
  </ul>
</div>

Theese are my codes. My codes seem that like picture 1. I want to do like picture 2. On the picture 1, there was a gap, how can i remove gap? If you help me, i will be glad.

Temani Afif
  • 245,468
  • 26
  • 309
  • 415
Erdem C.
  • 9
  • 3
  • Inspect the whole thing using your browser dev tools, then you will quickly find out where there are extra margins or paddings, that you need to eliminate. – CBroe Dec 02 '20 at 14:04
  • dont nest the list, espacially not that strangely. Then remove the float attributes. Float is the completly wrong tool for whatever you're trying. – tacoshy Dec 02 '20 at 14:06
  • @TemaniAfif the question is not a duplicate. Its not the default margins he is talking about. according to his pictures he is talking about "margins" cause because of nested lists - please re-open. – tacoshy Dec 02 '20 at 14:10
  • @tacoshy remove the default margin AND padding from the UL and you will get what he want. Inspect the code to notice that the gap is created due to default padding – Temani Afif Dec 02 '20 at 14:13
  • he is not talking about that margin. his pictures shows what he gets and wants. the default margin is still present there. The wanted outcome could be done with simply not nesting the list without changing the amrgins. – tacoshy Dec 02 '20 at 14:17
  • @tacoshy there is nothing wrong nesting list like this, it's fine. This is the process of creating sub menu. as I said, inspect the code to notice the extra padding in the nested list – Temani Afif Dec 02 '20 at 14:22

0 Answers0