0

CSS に問題があります。だれか助けてもらえますか? あるブラウザー用にデザインを作成できますが、別のブラウザーではうまくいきません。

たとえば、Chrome で修正しても Firefox では機能せず、その逆も同様です...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>Bookmark Storage</title>
<style>
.frmsub{


}

.btnsub{
position:relative;
left:-80px;
bottom:-24px;

}
.btnclear{
position:relative;
right:-30px;
top:0px;

}
.mltsub{
position:relative;
right:-30px;
top:375px;
}
.load{
position:relative;
right:290px;
top:30px;

}
</style>

</head>
<body background="http://www.dodaj.rs/f/1F/l0/2CSIzyy1/notebook1.jpg">
<div align="center">
<div align="center">
<form class="frmsub" action="./BK.pl" method="POST">
URL: <input name="HWID" type="text">  <br>
Short description(optional): <input name="HWID1" type="text1">  <br>
<input class="btnsub" value="Submit" type="submit"></form>
<form  action="./clear.pl" method="POST">
<input class="btnclear" value="Clear" type="submit">
</form></div></div>
<div align="center"><form method="POST" action="./multiBK.pl">

<input class="mltsub" value="Submit" type="submit">
</form><form method="POST" action="./AddS.pl">
<textarea name="HWID" rows="20" cols="50">Add bookmark source here, press load and then submit.
</textarea>
<input class="load" value="Load" type="submit">
</form></div>


<p align="center"></p>
<div align="center">
<div align="center">&nbsp;</div></div>
<p align="center">&nbsp;&nbsp;&nbsp;&nbsp; *Check your bookmarks: <a HREF="./newbm.html">Click</a></p>

</body>
</html>

見た目だけが重要で、形は気にしないでください...

4

3 に答える 3

1

はい、Markus が言ったように、よく知られているように CSS リセットを使用します: http://meyerweb.com/eric/tools/css/reset/

適用してもうまく動作しない場合は、コードに何か問題がある可能性があります

于 2013-08-02T15:54:02.290 に答える
0

これをcssファイルの先頭に追加してみてください：

{
margin:0;
padding:0;
}

そうすれば、大きなCSSリセットを使用せずに、デフォルトのブラウザのパディング/マージンの問題があるかどうかをテストできます...

私が言えることは、問題はあなたがそれをラップしていることだと思うということです

これにはデフォルトで 10 ピクセルの上下のパディングがあるため、css でそれを 0 にリセットしてみてください。

lineInput{
padding:0;
}

または、その段落を div に変更します。

それが解決策かもしれませんが、絶対配置を使用しているため、そうではないかもしれません...

写真の両方の部分のpxと文字を数えたところ、15pxです。オレンジ色の部分の末尾までの文字は、Firefox では 11px で、chrome では 8px です。Firefox では文字の上からオレンジ色の部分の先頭までが 12px で、chrome では 10px です。つまり、5px の違いです。

これを試して：

btnSubmit{
height:38px;
padding:0;
}

これにより、ボタンの高さが 38 ピクセルになり、文字がボタンの左上に表示されます。次に、おそらくこれを追加できます：

text-align:center;
padding-top:10px;

// または、垂直方向の中央揃えに必要な量。

于 2013-08-07T09:40:17.747 に答える