クライアントからの要望で主にCSSを使ってコーディングをしております。
下記のコードでひとつの記事が
<div class="line_dot"></div>でラインで区切られ下に続いていくようにしているのですが、
<div class="math_newsMerchant">
<div class="icon_newsMerchant">
<table width="100%" border="0" cellpadding="0" cellspacing="3">
<tr><td><img src="img/icon1.gif" /></td></tr>
<tr><td><img src="img/icon2.gif" /></td></tr>
</table>
</div>
<div class="txt_newsMerchant">
<p><a href="#">ID:1988 Pointcageモバイル (2006/9/27)</a></p>
<p>ポイント還元率は日本最大級!Point cafeモバイル誕生</p>
</div>
<a href="#" class="btn_merchant">提携先はこちら</a>
<div style="clear:both;"></div>
</div>
<div class="line_dot"></div>
<div class="math_newsMerchant">
<div class="icon_newsMerchant">
<table width="100%" border="0" cellpadding="0" cellspacing="3">
・
・
・
・
・
・
floatを使ってるため、math_newsMerchantでくくられている各センテンスの最後に<div style="clear:both;"></div>をいれております。
これが問題で、IEだとこのdivタグを入れると勝手に空白をつくってしまします。
FireFoxは正常に表示するのですが。
divじゃなくてimgタグでそのまま表示しても同じです。
divとimgの余白をなくす方法をどなたか知りませんでしょうか?
A 回答 (2件)
- 最新から表示
- 回答順に表示
No.2
- 回答日時:
floatをキャンセルするためにclearしているそうですが、これはline_dotの部分ですべきではないでしょうか。
それから、IEでは文書型宣言(!DOCTYPE宣言)によって後方互換モードと標準準拠モードの2種類の動作を行います。
文書型宣言なしでは後方互換モードとなり、Firefoxと違った動きになってしまいます。
文書型宣言を行って標準準拠モードにすれば、かなり近い動きになると思います。
参考URL:http://ameblo.jp/matchasoft/entry-10018174908.html
No.1
- 回答日時:
文書型宣言をしてますか。
IEはマージンとか余白がでたらめなので、宣言してあわせます。
PLUGINを使わないならFIREFOXの方を標準にして作った方がいい。
ご回答ありがとうございます。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio …
にしてました。
特に意味もわからずに・・
matchasoftさんにも教えていただいた参考ページを見て今後は気をつけたいと思います。
ありがとうごいました!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- HTML・CSS flex の各子要素を横幅 100% にしたい 1 2022/09/22 21:25
- HTML・CSS CSSのホバーエフェクト 1 2023/06/19 06:53
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- HTML・CSS 【HTML】【CSS】【Swiper】 元の画像は横1200×縦600なのですが、実際のサイト上に反 5 2022/07/16 13:57
- HTML・CSS PCサイズで赤い画像2つと、青い画像2つがそれぞれ横に2つずつ並んでいるのですが、これをスマホサイズ 5 2022/04/11 12:01
- HTML・CSS img と p を縦中央に配置したいのですがうまくいきません。 2 2023/01/12 14:38
- HTML・CSS FC2カートのテンプレートでの商品表示について 1 2023/03/02 18:05
- HTML・CSS 吹き出し 下記の吹き出しのスタイルシートについて 下記のスタイルシートは左側にアイコンがでる使用にな 1 2022/11/12 17:55
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ASP.NETでプレーンなページに文...
-
cnt <= (others => '0'); の意...
-
VBAでの素数の求め方
-
質問です。 新規登録ボタンが全...
-
Excel VBAでのIE操作でクリック...
-
htmlの文字が縦書きになる
-
HTML ul li で横並びにナビゲー...
-
【ヒトの神秘】美男美女から何...
-
HTML属性での「""」 「''」違い
-
htmlのolやulなどlistにtitleや...
-
CSSがなぜかfont-sizeだけ効か...
-
liタグの中に<p>タグやら<dl>を...
-
含む含まないという概念自体の...
-
リストマーカーをボックス内に...
-
Firefoxで一番下のstickyが上に...
-
スペースを使わず文字位置を揃...
-
表示倍率を変えるとレイアウト...
-
HRタグ 枠線を透明にするには?
-
<ul><li></li></ul>にするメリ...
-
セクションをdivで囲むと見出し...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ASP.NETでプレーンなページに文...
-
cnt <= (others => '0'); の意...
-
pythonでのカーソル移動がずれる
-
Excel VBAでのIE操作でクリック...
-
質問です。 新規登録ボタンが全...
-
safariで見るとページ上部に余...
-
CSSで、何故か、「float」が上...
-
vbaでieを操作しようとしていま...
-
VBAでの素数の求め方
-
css リンクの色が全部変わって...
-
SEO 検索エンジンについて
-
初歩的ですが・・・
-
CSSセクレター 子孫のみに適用...
-
DIVの入れ子で、FireFoxだとレ...
-
Ajaxで文字列を表示したいです。
-
ワードプレスで何度消しても空...
-
RubyのHTMLパーサーで複数のタ...
-
最初の文字後ろのスペースを大...
-
検索結果がツリー状に表示され...
-
IEとFireFoxの表示の違いで悩ん...
おすすめ情報