テーブル内の隙間の対処法とは？
- IE6でテーブル内の行(画像）と行(画像）の間にスペース(白い）ができてしまう問題について、解決方法を教えてください。
- HTMLのテーブル内に配置された画像がくっつかず、隙間ができてしまう現象が発生しています。IE6以外のブラウザでは正常に表示されているため、問題の原因がわかりません。対処方法を教えてください。
- dreamweaverCS2で作成したホームページのテーブル内に配置された画像がIE6で表示されると、隙間ができてしまい、画像同士がくっつきません。問題の原因と解決方法を教えてください。
- ベストアンサー
テーブル内の行の間に隙間ができてしまいます
いつもお世話になります。 dreamweaverCS2でホームページを作っています。 2行1列のテーブル内のセルそれぞれに画像を配置しているのですが、 IE6で表示すると、行(画像）と行(画像）の間にスペース(白い）ができてしまい、 画像同士がくっつきません。 上の行にはイメージマップを使用しています。 なんとか画像をくっつけた状態で表示したいのですが、どこに問題があるでしょうか。 画像の大きさは上の行のものが742*69 下のものが742*18です。 ちなみにHTMLは下記のようになります。 また、Netscape7.1やsafariではくっついた状態で表示できます。 困っています。よろしくお願いします。 *****以下HTML************ <table border="0" cellpadding="0" cellspacing="0" width="742" > <tr> <td width="742" > <img src="images/header1_1.gif" alt="" width="742" border="0" usemap="#hd1_Map" vspace="0"/> <map name="hd1_Map"><area shape="rect" coords="260,50,366,65" href="index.html" alt="Homeへ" /> <area shape="rect" coords="367,50,475,65" href="about.html" alt="***について" /> <area shape="rect" coords="476,50,590,65" href="members.html" alt="****一覧" /> <area shape="rect" coords="591,50,700,65" href="syukketsu.html" alt="***" /> </map></td> </tr> <tr> <td><img src="images/subnavibar1.gif" alt="" width="742" border="0" vspace="0" /></td> </tr> </table> ****ここまで****
- tomoyamma
- お礼率98% (99/101)
- ホームページ作成ソフト
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
<td width="742" > <img src="images/header1_1.gif" alt="" width="742" border="0" usemap="#hd1_Map" vspace="0"/> <map name="hd1_Map"><area shape="rect" coords="260,50,366,65" href="index.html" alt="Homeへ" /> <area shape="rect" coords="367,50,475,65" href="about.html" alt="***について" /> <area shape="rect" coords="476,50,590,65" href="members.html" alt="****一覧" /> <area shape="rect" coords="591,50,700,65" href="syukketsu.html" alt="***" /> </map></td> これを↓のようにしたらどうなる？ <td width="742" > <img src="images/header1_1.gif" alt="" width="742" border="0" usemap="#hd1_Map" vspace="0"/>< map name="hd1_Map"><area shape="rect" coords="260,50,366,65" href="index.html" alt="Homeへ" />< area shape="rect" coords="367,50,475,65" href="about.html" alt="***について" />< area shape="rect" coords="476,50,590,65" href="members.html" alt="****一覧" />< area shape="rect" coords="591,50,700,65" href="syukketsu.html" alt="***" />< /map></td> http://www.google.com/search?q=html%20%E3%83%9B%E3%83%AF%E3%82%A4%E3%83%88%E3%82%B9%E3%83%9A%E3%83%BC%E3%82%B9&hl=ja&lr=
関連するQ&A
- クリッカブル・マップのリンクが効かない
下記のコードでpngの画像上でリンクをつけましたが、カーソルをかざしても反応が有りません。どこが間違っているのでしょうか？ 皆様、ご教授お願いします <table width="750" align="center"> <tbody> <tr><td> <img src="top2.png" usemap="#top2"> <map name="top2"> <area shape="rect" coords="20,197,63,206" href="http://------.html" alt="A"> <area shape="rect" coords="78,198,121,206" href="http://------.html" alt="b"> <area shape="rect" coords="137,198,181,206" href="http://------.html" alt="c"> <area shape="rect" coords="196,198,239,206" href="http://------.html" alt="d"> <area shape="rect" coords="19,163,63,272" href="http://------.html" alt="e"> <area shape="rect" coords="77,264,121,272" href="http://------.html" alt="f"> </map> </td> </tr> </tbody> </table>
- 締切済み
- XML
- mapが機能しない
以下のようにmapを設置しましたが、全く機能しません。何が考えられるでしょうか？ <div><img src="images/head.jpg" alt="" usemap="#map" border="0"/></div> <map name="map"> <area href="kan.html#3" alt="" shape="rect" coords="0,3,105,154" /> <area href="kan.html#2" alt="" shape="rect" coords="314,3,393,154" /> <area href="kan.html#1" alt="" shape="rect" coords="106,3,211,146" /> </map>
- ベストアンサー
- HTML
- 吹き出しに画像とコメントを入れるプログラム
下記のプログラムで吹き出しを作成して 画像とコメントを表示したいのですが なかなか出来ず困っております。 方法がありましたらよろしくお願いいたします。 <img src="画像名" usemap="#map" border="0"> <map name="map"> <area shape="rect" coords="305,60,390,126" href="アドレス" alt="北海道"> <area shape="rect" coords="288,151,331,181" href="アドレス" alt="青森"> <area shape="rect" coords="280,181,311,221" href="アドレス" alt="秋田"> <area shape="rect" coords="310,181,341,221" href="アドレス" alt="岩手"> <area shape="rect" coords="275,221,305,245" href="アドレス" </map>
- ベストアンサー
- JavaScript
- map初心者です
名前の付け方がわかりません。 なんでもいいのでしょうか？とりあえずわからないので画像名と同じ名前に設定しました。 また、下の記述が全部なのですが画像しかアップされません。 リンクすらなりません。 どこがおかしいのでしょうか。よろしくお願いします。 <img src="img/1.jpg" usemap="#1map" border="0"> <map name="1map"> <area shape="rect" coords="220,148,179,200" href="http://12345" alt="**" target="_blank"> <area shape="rect" coords="358,125,181,126" href="http://12345" alt="**" target="_blank"> <area shape="rect" coords="167,336,178,141" href="="http://12345" alt="**" target="_blank"> <area shape="rect" coords="178,338,180,214" href="="http://12345" alt="**" target="_blank"> </map> 関係あるかわかりませんが、使っているのはロリポップです。
- ベストアンサー
- HTML
- ブラウザに対応させるには？
はじめまして 現在xoopsでホームページ作成してるんですけど ブロック配置を「中央ブロック中央」で設定し htmlでトップを作ってブラウザで確認したのですけどfirefoxでみたときにイメージマップで作ったリンクがリンクされてないのです。 一応、私もいろいろ思いつくことはやってみたのですけど・・・どうしても出来なかったので質問したしだいです。 これが問題のタグなんですが <table> <td align="center" width="" height=""> <img src="" width="" height="" border="" usemap="#Map"> <map name="Map"> <area shape="rect" coords="6,5,54,56" href=""> <area shape="rect" coords="71,6,121,55" href=""> <area shape="rect" coords="135,5,185,55" href=""> <area shape="rect" coords="198,5,248,54" href=""> </map> の部分がfirefoxではリンクされない状態で画像が表示した状態になるところです。 ご回答よろしくお願いします。
- 締切済み
- HTML
- クリッカブルマップのリンクが‥
クリッカブルマップでリンクさせたくて、記述いたしましたが、リンクが有効になっていません。 ブラウザ上では画像表示のままでハイパーリンクになっておらず、目的のページへ行けない状態です。 これは何が原因でしょうか。 以下、htmlの記述です。みなさま、どうかご教授のほどお願いします。 <img src="./images/menu1.jpg" usemap="#linkmap" border="0" height="81" width="500"> <map name="linkmap"> <area shape="rect" coords="x15,y22,x88,y53" href="$home" alt="ホーム"> <area shape=rect coords="x88,y22,x203,y53" HREF="http://"> <area shape=rect coords="x201,y22,x310,y53" HREF="./index.cgi?mode=top"> <area shape=rect coords="x309,y22,x418,y53" HREF="http://"> </map>
- 締切済み
- HTML
- background-imageが表示されない
ヘッダーの部分の背景画像が表示されません。 ＣＳＳ #header { height: auto; display:block; margin:0px;padding:0px;width:100%; background-image: url(../images/mainback.png); } ＨＴＭＬ <div id="header"> <div><img src="images/topbar2.gif" alt="" usemap="#map2" border="0" /></div> <map name="map2"> <area href="s.html" alt=""shape="rect"coords="394,57,495,68" /> <area href="t.html" alt=""shape="rect"coords="510,57,605,68"/></map> <div><img src="images/main.png" alt="" usemap="#map1" border="0" /></div> </div> 上記のようにヘッダー画像の下に背景画像をつけたいのですが、画像がある場合背景画像は重ならないんでしょうか？
- ベストアンサー
- HTML
- IE6でヘッダーとイメージの間に微妙な隙間
ヘッダーとンイメージはそれぞれdivで囲んでいます。IE6でヘッダーとメインイメージの間に微妙な隙間が隙間が空いてしまいます。FOXでは隙間は空きません。なぜでしょうか？ 教えてください。 ==HTML== <div id="header"><img src="images/head.gif" width="821" height="161" border="0" usemap="#Map2" /> <map name="Map2" id="Map2"> <area shape="rect" coords="674,124,775,144" href="#" /><area shape="rect" coords="36,17,322,85" href="#" /> </map></div> <div id="main_img" align="center"><img src="images/main_flash.jpg" width="801" height="305" border="0" /></div> ==css== /*==ヘッダー関係==*/ #header img{ margin:0 0 0 0; padding:0; height:161px; } /*============ボディ部分開始============*/ #main_img{ background:url(../images/main_flash_bg.jpg) no-repeat; width:821px; height:305px; margin:0; padding:0; }
- ベストアンサー
- HTML
- 初心者ですが・・・・・
はじめまして 最近ホームページを勉強中のものです。 xoopsというソフトを使って作っているんですけど 配置は中央ブロック中央で htmlでちょっとしたトップを作ってブラウザで確認したのですが、 画像にリンクを張ったところがfirefoxでは画像だけになっていてリンクされない状態で表示されてしまいます。 これが一応全タグなんですけど ちょっと初心者が作った奴なんで・・・・・・・・・・ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <meta http-equiv="Content-Style-Type" content="text/css"><title></title> </head><body onload="jikoku();MM_preloadImages('genki1.gif')" background=""> <center> <table border="0"> <tbody> <td background="" width="650" height="30"></tr> </tbody> </table> </center> <center> <table> <tbody> <tr> <td align="center" height="295" width="448" border="10px"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="448" height="295"> <param name="movie" value=""> <param name="quality" value="high"> <embed src="" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" bgcolor=#FFFFFF width="448" height="295"></embed> </object></td><br> <td align="center" height="313" width="279"><img src="" border="0" height="250" width="150" usemap="#Map"><map name="Map"> <area shape="rect" coords="42,201,135,222" href="mailto:info@m-sh.jp?Subject=問い合わせ"><b><font size="+2"> </font></b> <a href=""><span style="font-size: 10.5pt; font-family: Century;" lang="EN-US"></span></a></font> </td> </tr> </tbody> </table> <table border="0"> <tbody> <td rowspan="2" align="center" background="" width="650" height="30"</td> </tr> </tbody> </table> <marquee> <font size="+1"><strong><a href="" target="frame2"></a></strong><a href=""><font color="#ff0000"><strong></strong></font><font color="#ff0000"></font><font color="#ff0000"></font><font color="#ff0000"></font></a></font> </marquee> </font> <table> <td align="center" width="260" height="60"> <img src="" width="260" height="60" border="0" usemap="#Map"> <map name="Map"> <area shape="rect" coords="6,5,54,56" href=""> <area shape="rect" coords="71,6,121,55" href=""> <area shape="rect" coords="135,5,185,55" href=""> <area shape="rect" coords="198,5,248,54" href=""> </map> <td align="center"> <marquee> <br><font size="+1>********</font> </marquee> なんですが <table> <td align="center" width="260" height="60"> <img src="" width="260" height="60" border="0" usemap="#Map"> <map name="Map"> <area shape="rect" coords="6,5,54,56" href=""> <area shape="rect" coords="71,6,121,55" href=""> <area shape="rect" coords="135,5,185,55" href=""> <area shape="rect" coords="198,5,248,54" href=""> </map> の部分が画像だけになってしまいます。 なんか間違いとかありましたら指摘とご指導お願いします。
- ベストアンサー
- HTML
- クリッカブルマップで画像と画像の間に隙間が出来てしまう
現在、ホームページを作ってみようと思い作成しているのですが、クリッカブルマップを使い、画像の特定の場所からリンクをさせようと思っているのですが、 クリッカブルマップを使っている画像Aと同じくクリッカブルマップを使っている画像Bを上下に隙間なく並べようとすると数pxほど隙間が開いてしまいます。 単なる画像データを上下に並べた時にはぴったりとくっついていたので、マージンやパディングの設定がおかしい訳ではないだろうと思っているのですが、これはクリッカブルマップを追加した事によって何か追加でスタイルシートを設定してあげなければいけないのでしょうか？ それとも、クリッカブルマップを使った時はどうしても隙間を埋める事ができないのでしょうか？ 1つの画像でやればいいのですが、HPのデザイン上・管理上の都合(画像データの差し替え頻度)どうしても分けて使いたいと思っています。 ご回答お願いします。 該当部分のHTMLソースです。 <img src="top.jpg" alt="ようこそ" usemap="#map1" width="600" height="200" /> <map name="map1"> <area shape="rect" coords="0,0,200,200" href="auto.html" /> </map> <img src="top.jpg" alt="ようこそ" usemap="#map2" width="600" height="200" /> <map name="map2"> <area shape="rect" coords="400,0,600,200" href="auto.html" /> </map>
- ベストアンサー
- HTML
お礼
早々のご回答ありがとうございます。 教えていただいたように改行をなくしたらできました！ ホワイトスペースについての参考URLもありがとうございます。 勉強になりました。