<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>
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