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

430f57e2b720679e3c89151b150fe346
672e7f5ab659f345b0d1ac77e63bc8a8
25edfb22a4f469ecb59f1190150159c60b9f73f8e206867bd1f5dc5957dbcb38Giftce7579caeff7048e72ce1ac3d0045ce8
929d1f5ca49e04fdcb27f9465b944689