Centering problem, please ask a master_html/css_WEB-ITnose

<style type="text/css">body{	text-align:center;}li{	background-image:url(images/btn3.jpg);	float:left;	list-style-type:none;	width:155px;	height:58px;	text-align:center;	color:#F09;	font-weight:bold;	font-size:16px;	font-family:Arial, Helvetica, sans-serif;}</style></head><ul>    <li></br>Gift</li>    <li></br>I,Say</li>    <li></br>Photo</li>    <li></br>Letter</li></ul>

This li still cannot be centered. I have tried various methods. Please help me. How can I control the position of the button on the page? CSS seems to be difficult to use, so I should use it. Wrong

Reply to discussion (solution)

float:left; will not be centered because it has escaped the document flow. You It can be changed to display:inline;

dispaly:inline; I tried it, but there was no floating effect. I removed the background image of li and it can be centered. What happened?

was added to ul. For a div, set the width, and then margin: 0 auto; in this case, the entire ul should be in the center

It is best to clear the float after the ul

• 
  Gift                                                                      ;/li>
  

Give ul width, then margin-left:-width. Then use position: relative, and it’s done.

Thank you, everyone, it’s easy to use. Thank you.