Firefox中line-height的问题

dhq314 2008-10-28 01:39:53

怎么height跟line-height相等时在IE7,Chrome文字居中显示,但Firefox却紧贴input顶部?



<!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=UTF-8" />

<style type="text/css">

<!--

   #inp{

       font-size:13px;

       width:50%;

	   height:30px;

	   line-height:30px;

	   border:1px solid #929292;

	   overflow: hidden;

   }

-->

</style>

</head>

<body>

   <input type="text" name="title" value="why" id="inp" />

</body>

</html>

...全文

822 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

seo_sun 2012-11-01

打赏
举报

银魂飞雪说的对，加上*{margin:0;padding:0;}就可以。。

webad20 2008-10-30

打赏
举报

input控件的样式比较麻烦
还跟<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
有关系
你可以设padding

yinhunfeixue 2008-10-29

打赏
举报

#inp{
font-size:13px;
width:50%;
height:30px;
line-height:30px;
border:1px solid #929292;
}
-->
</style>
</head>
<body>
<div id="inp">aaaaaaaaaaaa</div> //按成DIV，并把文字写到innerText中，在FF就是居中的，用VALUE不行
</body>
</html>

yinhunfeixue 2008-10-29

打赏
举报

padding
margin
设为0

Eagle_ice 2008-10-29

打赏
举报

[Quote=引用 1 楼 Cyril_Tam 的回复:]
不要用height和line-height

用padding吧,代码如下

HTML code
<!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=UTF-8" />
<style type="text/css">
<!--
#inp{
font-size:13px;
width:50%;
…
[/Quote]
支持这个...

MOTA 2008-10-29

打赏
举报

FF不支持INPUT的LINE-HEIGHT

汉森cd 2008-10-29

打赏
举报

vertical-align呢?

Cyril_Tam 2008-10-28

打赏
举报

不要用height和line-height

用padding吧,代码如下



<!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=UTF-8" />

<style type="text/css">

<!--

   #inp{

       font-size:13px;

       width:50%;

       border:1px solid #929292;

       overflow: hidden;

	   padding-top:10px;

	   padding-bottom:10px;

   }

-->

</style>

</head>

<body>

   <input type="text" name="title" value="why" id="inp" />

</body>

</html>