1306851913 以下のhtmlを表示するとき、firefox, chrome, safariでは「お問い合わせ」にpaddingがちゃんと効くのですが、IEだと効いてくれません。

端っこによって表示されてしまいます。

<div id="header">
<div id="headNavi" class="clearfix">
<h1><a href="http://xxx.com"><img style="float: left;" alt="aaa" src="http://xxx.com/xxx.gif" width="135" height="39" class="over" /></a></h1>
<p style="bottom: 5px; float: right; padding: 1.5%; width: 100px; "><a href="http://xxx.com/help.html" target="_blank" >お問い合わせ</a></p>
</div>
</div>

IEでも同じようにpaddingを効かすにはどう変更したらよいでしょうか?

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2011/05/31 23:25:16
  • 終了:2011/06/07 23:30:03

回答(2件)

id:deflation No.1

deflation回答回数1036ベストアンサー獲得回数1262011/06/01 00:07:20

ポイント100pt

IEのバージョンは幾つですか?

手元のIE8/IE9ではpaddingは効いています。

id:Lhankor_Mhy No.2

Lhankor_Mhy回答回数779ベストアンサー獲得回数2302011/06/01 11:09:29

ポイント100pt

これは知らなかったですね。おそらくIEのバグだと思います。

ただ、id:deflationさんは有効に再現しているとおっしゃってますので、ひょっとすると何らかの環境の問題かもしれません。

次のソースをご覧下さい。

<style>
div{
background-color:#ccc;
width:1000px;
}
#width{
background-color:#c55;
width:200px;
padding:10%;
}
#no-width{
background-color:#5c5;
padding:10%;
}
</style>
<div>
<p id="width">width</p>
<p id="no-width">no-width</p>
</div>

これをfirefox4で表示すると以下のようになります。

f:id:Lhankor_Mhy:20110601102841p:image:medium

一方IE8ですとこうなります。

f:id:Lhankor_Mhy:20110601103537j:image:medium

解決法としては、「paddingでパーセント指定をしない」ということになるかと思います。

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません