align center a UL with only images [duplicate] - html

Question

This question already has answers here:
How to align a <div> to the middle (horizontally/width) of the page [duplicate]
(27 answers)
Closed 6 years ago.
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 1

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

Answer 2

Do it like this
.logo_wrapper {
width: 100%;
position: relative;
}
.logos {
position: absolute;
left: 50%;
transform: translateX(-50%);
padding: 0;
}
.logo {
display: inline-block;
margin: 0 auto;
text-align: center;
float: left;
}
<div class="logo_wrapper">
<ul class="logos">
<li class="logo">
<img src="imgs/logo1.gif">
</li>
<li class="logo">
<img src="imgs/logo2.gif">
</li>
<li class="logo">
<img src="imgs/logo3.gif">
</li>
<li class="logo">
<img src="imgs/logo4.gif">
</li>
<li class="logo">
<img src="imgs/logo5.gif">
</li>
<li class="logo">
<img src="imgs/logo6.gif">
</li>
</ul>
</div>

Answer 3

First of all remove the class name for div. ul and div have the same class name.
Give float:left to li
.logos{
margin:0 auto;
display:table;
}
.logos li{
float:left;
}
<div>
<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>