在线情况
楼主
  • 头像
  • 级别
  • 徽章
  • 职务总版主
  • 声望+14
  • 积分1530
  • 经验278129
  • 文章2378
  • 注册2003-06-14
按钮文字垂直居中问题
所有的浏览器中, firefox不支持按钮的 line-height CSS样式定义.
也就是无法实现按钮中的文字智能垂直居中.
只能通过 padding-bottom来调整. 比如

[code].fmbtn{font-family: "Tahoma", "宋体","sans-serif";
    font-size:9pt;
    border: 0px #003399 solid;
    color:#003366;
    background-color: #e8f4ff;
    cursor: pointer;
    padding:0px;
    margin:0px;
    font-style: normal ;
    height:22px;
    line-height:23px;
    padding-bottom:2px;
    }[/code]

最后的 padding-bottom:2px; 即是为了兼容firefox下面的显示.
IE下也能表现正常.

但在opera等浏览器下, padding-bottom起了作用,反而变得无法居中.

使用传统的按钮样式, firefox下表现正常
再通过ie的css hack,可以完美实现文字垂直居中

[code].fmbtn{font-family: "Tahoma", "宋体","sans-serif";
    *padding-top:2px; /*ie6 ie7*/
    }[/code]
asp技术学习感谢您的参与
Page created in 0.0156 seconds with 2 queries.