如何水平居中

下面滚动条部分想让它水平居中,或者说让它看上去象水平居中(ie,ff下)
不要用到hack,不然在计算方面会出现点误差....
大虾们  指教下吧
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title></head>
<body style=" padding:30px; margin:0px;">
    <div id="container3" style="width:840px; height:216px;background-image:url(l.gif); border:2px solid #b50000; border-top:none;">
    <div style="height:170px; width:90%; overflow:hidden;margin:0 auto;">
<table width="3150" height="170" border="0" cellspacing="0" cellpadding="0">
  <tr bgcolor="#00FF00">
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
    <td width="210" align="center"></td>
  </tr>
</table>
</div>
    <div id="scroll3" style="height:auto; ">
        <div style="  background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:30px; background-position:-182px 0px; float:left;  "></div>
<div  style=" background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif);height:20px; width:660px; background-position:0px -226px; float:left;  ">
<div id ="block3" style="background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:162px; background-position:-14px 0px; position:absolute "></div>
</div>
<div style=" background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:30px; background-position:-216px 0px; float:left; "></div>
    </div>
    </div>    
</body>
</html>

解决方案 »

  1.   


    貌似要用 style="text-aligh:center"
      

  2.   

    这样行不行？
    <div id ="block3" style="left:320px;
      

  3.   


    <body>
    <div id="container3" style="width:840px; height:216px;background-image:url(l.gif); border:2px solid #b50000; border-top:none;">
        <div style="height:170px; width:90%; overflow:hidden;margin:0 auto;">
        <table width="3150" height="170" border="0" cellspacing="0" cellpadding="0">
      <tr bgcolor="#00FF00">
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
      </tr>
    </table>
        </div>
        <div id="scroll3" style="height:auto;width:90%;margin:0 auto; ">
            <div style="  background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:30px; background-position:-182px 0px; float:left;  "></div>
            <div  style=" background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif);height:20px; width:696px; background-position:0px -226px; float:left;  ">
            <div id ="block3" style="background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:162px; background-position:-14px 0px; position:absolute "></div>
            </div>
            <div style=" background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:30px; background-position:-216px 0px; float:left; "></div>
        </div>
        </div> 
    </body>
      

  4.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title></title></head>
    <body style=" padding:30px; margin:0px;">
        <div id="container3" style="width:840px; height:216px;background-image:url(l.gif); border:2px solid #b50000; border-top:none;">
        <div style="height:170px; width:90%; overflow:hidden;margin:0 auto;">
        <table width="3150" height="170" border="0" cellspacing="0" cellpadding="0">
      <tr bgcolor="#00FF00">
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
        <td width="210" align="center"></td>
      </tr>
    </table>
        </div>
        <div id="scroll3" style="height:auto;"><center><table width="740"><tr>
            <td style="  background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:30px; background-position:-182px 0px; float:left;  "></td>
            <td  style=" background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif);height:20px; width:660px; background-position:0px -226px; float:left;  ">
            <div id ="block3" style="background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:162px; background-position:-14px 0px; position:absolute "></div>
            </td>
            <td style=" background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:30px; background-position:-216px 0px; float:left; "></td><t/r></table></center>
        </div>
        </div>    
    </body>
    </html>
    看看是不是这样？
    下面的放滚动条的div整个里面用个center标签，然后用table，宽度就是你整个scroll的宽度，就可以居中了。
      

  5.   

        <div id="scroll3" style="height:auto; ">
            <div style="  background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:30px; background-position:-182px 0px; float:left;  "></div>
            <div  style="background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:400px; background-position:0px -226px; float:left; padding-left:260px;">
            <div id ="block3" style="background:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif) -14px 0px ; height:20px; width:162px; position:absolute "></div>
            </div>
            <div style=" background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090901/095636984.p.gif); height:20px; width:30px; background-position:-216px 0px; float:left; "></div>
        </div>
        </div>