please help make this html page looks same in firefox
<?xml version="1.0" encoding="UTF-8" ?>
<!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" />
<title>to patch omnigrid style</title>
<style type="tex开发者_StackOverflow中文版t/css">
.pDiv{
border : 1px solid #ccc;
padding : 2px 5px;
font-size : 12px;
font-family : "Microsoft YaHei", "宋体",Arial, Helvetica, sans-serif;
}
.pButton{
width : 16px;
height : 16px;
border : none;
background-position : 0px 3px;
-webkit-background-position : 0px 1px;
background-color : #fff;
background-repeat : no-repeat;
cursor : pointer
}
.pInput{
text-align:center
}
#first{
background-image : url(imgs/first.gif);
}
#prev{
background-image : url(imgs/prev.gif);
}
#next{
background-image : url(imgs/next.gif);
}
#last{
background-image : url(imgs/last.gif);
}
</style>
</head>
<body>
<div style="padding: 100px 100px 100px 100px">
<div class="pDiv">每页显示：
<SELECT class=rp name=rp>
<OPTION selected value=10>10</OPTION>
<OPTION value=20>20</OPTION>
<OPTION value=50>50</OPTION>
<OPTION value=100>100</OPTION>
<OPTION value=200>200</OPTION>
</SELECT> ～
<button id="first" class="pButton" title="第一页"></button>
<button id="prev" class="pButton" title="上一页"></button>
第<input class="pInput" type="text" size="2" />页共10页
<button id="next" class="pButton" title="下一页"></button>
<button id="last" class="pButton" title="最后一页"></button>
</div>
</div>
</body>
</html>
IE:
FireFox:
It's usually easier to make it look right in Firefox and other standards-compliant browsers then apply fixes for IE.
Here I modified contents please try this, It works on different browsers
<?xml version="1.0" encoding="UTF-8" ?>
<!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" /> <title>to patch omnigrid style</title> <style type="text/css"> .pDiv{
border : 1px solid #ccc;
padding : 2px 5px;
font-size : 12px;
font-family : "Microsoft YaHei", "宋体",Arial, Helvetica, sans-serif;
position:absolute; }
*{padding:0px;margin:0px;}
.pButton{
width : 16px;
height : 16px;
border : none;
background-position : 0px 3px;
-webkit-background-position : 0px 1px;
background-color : #fff;
background-repeat : no-repeat;
cursor : pointer } .pInput{
text-align:center }
#first{
background-image : url(imgs/first.gif); }
#prev{
background-image : url(imgs/prev.gif); }
#next{
background-image : url(imgs/next.gif); }
#last{
background-image : url(imgs/last.gif); } </style> </head> <body> <div style="padding: 100px 100px 100px 100px; position: relative;"> <div class="pDiv">每页显示：
<SELECT class=rp name=rp>
<OPTION selected value=10>10</OPTION>
<OPTION value=20>20</OPTION>
<OPTION value=50>50</OPTION>
<OPTION value=100>100</OPTION>
<OPTION value=200>200</OPTION>
</SELECT> ～
<button id="first" class="pButton" title="第一页"></button>
<button id="prev" class="pButton" title="上一页"></button>
第<input class="pInput" type="text" size="2" />页共10页
<button id="next" class="pButton" title="下一页"></button>
<button id="last" class="pButton" title="最后一页"></button> </div> </div> </body> </html>
Copy and paste into your page. It works
I tested on IE & firefox, please mark as a Answer.
- Thanks Abhishek
加载中,请稍侯......
精彩评论