CSSテクニックコミュのお申し込み部分の微妙なズレと黒い点

左の画像はfirefoxでの画像で右の画像がIEでの画像です。

■firefoxでの問題
メインビジュアル下のコンテンツの右上に黒い点があります。
おそらくリストのマーカーだと思うのですが、原因が
つかめません。

■IEでの問題
お申し込みボタンがある部分が全体的に左寄りになってしまうのですが、firefoxでの表示と同じにしたい場合はどうすればいいのでしょうか。原因、または対処方法を教えて頂ければ幸いです。

【HTML】


<div id="application">

<h2><a href="#" id="anchor01">お申し込み</a></h2>
<p><a href="#" title="お見積もりはこちら">お見積もり</a></p>
</div>





<div id="blog">

<p id="ecob"><a href="#" title="ユーザーとのコミュニケーションの場エコブロへ"><span id="s">エコパッチンブログ展開中！</span></a></p>
</div>



【CSS】
#application{
width:229px;
height:188px;
float:right;
margin-right:4px;
padding:0;
text-indent:-9999px;
background-image:url("../images/images2/printing.png");
background-repeat:no-repeat;
_background-image: none;
}

#blog{
width:231px;
height:87px;
float:right;
padding:0;
margin-right:4px;
text-indent:-9999px;
background-image:url("../images/images2/blog.png");
background-repeat:no-repeat;
_background-image: none;
}

#ecob{
text-decoration:none;
}

#ecob a{
display:block;
text-decoration:none;
overflow:hidden;
position:absolute;
left: 534px;
top: 606px;
width: 220px;
height: 66px;
}

どうぞよろしくお願い致します。

コメント(3)

最初
全て
最新の40件

[1] mixiユーザー 02月14日 14:30

推測レベルでの書き込みなので解決できなかったらすいません。

>■firefoxでの問題
>メインビジュアル下のコンテンツの右上に黒い点があります。
>おそらくリストのマーカーだと思うのですが、原因が
>つかめません。
リストのマーカであるならその内容をfloat:leftすると同じようなことになったと思います。
list-style:noneとかで解決できそうな気がします。
同じくIEではそのリスト分widthが広がってしまっているのかもしれないので直せば同時に解決するかもしれませんね。

[2] mixiユーザー 02月15日 01:43

確かIEでfloatをするとmarginが二倍になるバグがあったように思います。
回避策は、display: inline:\;
を指定する、だったと記憶してます。

[3] mixiユーザー 02月15日 14:41

>アトリ様
やはりリストが関係していました。問題となっているリストをHTMLで消去法で見つけ出し、何とか解決できました。
ありがとうございました。

>えく様
フロートをleftにしたら両方のブラウザで同じように表示されたのであとはmarginで調整して解決出来ました。
ありがとうございました。

ログインすると、みんなのコメントがもっと見れるよ