hal 2001 hal 2001 - 2 months ago 8
CSS Question

align center a UL with only images

I have a

<ul>
with 6 images, no text. I can't seem to make it be in the center of the page. This is my code.

CSS

.logos{
margin:0 auto;
text-align:center;
display:table;
float: left;
}


HTML

<div class="logos" style="margin:0 auto;">
<ul class="logos">
<li class="logos"> <img src="imgs/logo1.gif"> </li>
<li class="logos"> <img src="imgs/logo2.gif"> </li>
<li class="logos"> <img src="imgs/logo3.gif"> </li>
<li class="logos"> <img src="imgs/logo4.gif"> </li>
<li class="logos"> <img src="imgs/logo5.gif"> </li>
<li class="logos"> <img src="imgs/logo6.gif"> </li>
</ul>
</div>

Answer

You need to change

.logos{ 
      margin:0 auto; 
      text-align:center;
      display:table;
      float: left;
}

to

.logos{ 
      margin:0 auto; 
      text-align:center;
      display:table;

}

and the content will be in the middle of the page

Also you need to delete the div because is useless ,you set the same class to the ul and to div