Separate CSS JSP icons

Navigation
0

I want to separate my icons, because they are many together but I can not. By putting padding the application stays like this.

Increases with and heigth by not separating icons. 

.redes_sociais{
    padding: 30px;
}

.top{
    padding: 30px;
}
<ul class="top">
    <li><i class="fa fa-phone"></i> Atendimento</li>
    <li><i class="fa fa-envelope"></i> Ajuda</li>    
</ul>
<ul class="redes_sociais">
    <li><i class="fa fa-facebook" action="" ></i></li>
    <li><i class="fa fa-twitter" action=""></i></li>
    <li><i class="fa fa-linkedin" action=""></i></li>
    <li><i class="fa fa-dribbble" action=""></i></li>
    <li><i class="fa fa-google-plus" action=""></i></li>
</ul>
    
asked by anonymous 20.09.2017 / 04:25

1 answer

0

padding is being applied to element ul.redes_sociais , not to items inside it ( ul.redes_sociais > li ).

Add this snippet to your CSS: 

.redes_sociais li {
  padding: 30px;
}
    
20.09.2017 / 05:50
Register / Display List C # Keep CountDownTimer running after the app closes