テーブルの隙間を無くす方法とは?

このQ&Aのポイント
  • DreamWeaverCS4を使用してホームページを制作中の方からの相談です。テーブルの表示に問題があり、具体的な要件と解決策を知りたいそうです。
  • テーブルの設定や画像の配置によって、隙間や背景の見え方に問題が発生しているようです。解決策を教えていただけると助かります。
  • テーブル内の画像配置後に隙間が生じ、背景が見えてしまう問題があるそうです。テーブルの隙間を無くし、背景が見えなくする方法を教えてください。
回答を見る
  • ベストアンサー

テーブルの隙間を無くしたい

DreamWeaverCS4を使いホームページを作成しております。そこでテーブルについて、狙い通りに上手く表示が出来なくて困っております。どなたかご指導アドバイスをお願い致します。具体的な内容は下記のとおりです。 ・テーブルを「7列2行(全体の大きさは横700px×縦100px)」で作成し、内訳は1行目は、一枠横100px×縦50pxの大きさで7枠作成。2行目は横700px×50pxで作成。 上記内容のテーブル1行目に横100px×縦50pxのサイズの画像を7つ挿入。そして2行目には横700px×縦50pxの画像を1つ挿入しました。 そしてテーブルの設定は「ボーダーは0」です。 しかし、画像挿入後には2行目の画像横700px×縦50pxが入っているテーブルに隙間が出来て背景が見えてしまいます。1行目を見ると…微妙に各画像間の間に隙間が空いていて、この隙間が全体的に700pxを超えているようなんです。それで、2行目の画像に対して背景が見えて(テーブルの幅が広がってしまっています)いるのです。 そこでですが、画像を配置後にテーブルの隙間をきっちりと無くして背景が見えなくする方法ってあるのでしょうか? 解る方がいましたら…ご指導…アドバイスをお願い致します…。よろしくお願い致します…。

  • HTML
  • 回答数2
  • ありがとう数1

質問者が選んだベストアンサー

  • ベストアンサー
  • os6v100i
  • ベストアンサー率44% (16/36)
回答No.1

どんなHTMLになっているのかわからないので、推測で 1.tableのcellspacing属性が0になっていない 2.tdにmarginもしくはpaddingが指定されている のどちらかでしょう (可能性としては1が高いかな) 使用するブラウザなどで見え方が変わることもありますので、HTMLの質問する場合、確認したブラウザやHTMLのソースも提示した方がいいですよ?

gunhiro
質問者

補足

os6v100iさん: こんにちわ。ご回答、アドバイス有難うございました。 早速ですが、ブラウザはIEの「6」です。 上記「1」を確認しましたが、HTMLの記述が下記のようになっておりました…。 <table width="700" border="0" cellspacing="0" cellpadding="0"> また「2」にありますような「tdにmarginもしくはpaddingが指定」との事ですが、初心者の為にその確認方法が解らないです。ですので、この件についてはまだ確認出来ておりません。 自分のような初心者が、このような質問をして大変に申し訳ございませんが、再びご回答、ご指導、アドバイスをお願い致します。 よろしくお願い致します。

その他の回答 (1)

  • os6v100i
  • ベストアンサー率44% (16/36)
回答No.2

もう一つ推測です IMGタグのborderの可能性もありますね DreamWeaverは使ったこと無いので操作方法とかはわかりません。 HTMLとCSS(スタイルシート)のソースを提示していただければどこを直せばいいのかは答えられますが・・・

gunhiro
質問者

補足

os6v100iさん: 色々と大変にすみません。そして本当に有難うございます。 早速ですが…HTMLのソースをご提示したいのですが、その場合どのような方法でご提示をすれば良いのでしょうか…? すみません、こんな初歩的な質問をしてしまって…。

関連するQ&A

  • 画像を使ったテーブルで隙間ができてしまいます

    画像を枠に使ったテーブルをHTMLで作成し、FC2ブログに載せています。 Chrome上ではうまく表示されるものの、IE、Firefoxでは Rowの上に隙間ができてしまい、枠画像が正しく表示されません。 ----------Tableの基本構造---------- <table cellspacing="0" cellpadding="0" border="0" width="x" height="y" bgcolor="#FFFFFF"> <tr><td><img src="左上角"></td> <td><img src="上部"></td> <td><img src="右上角"></td></tr> <tr><td width="15"><img src="左1列目"></td> <td style="color:# … ;"> 内容1</td> <td width="15"><img src="右1列目"></td></tr> <tr><td width="15"><img src="左2列目"></td> <td style="color:# … ;"> 内容2</td> <td width="15"><img src="右2列目"></td></tr> <tr><td><img src="左下角"></td> <td><img src="下部"></td> <td><img src="右下角"></td> </tr></table> -------------以上-------------- 上記のものよりも実際は行と列を増やしておりますが、基本的に増殖しているだけです。 1行目と2行目の間に隙間ができて縦の画像枠が細切れになっています。 隙間ができているのは行の下ではなく、上の部分のように見えます。(背景色の見え方などから) テーブルのみの上記コードは、ローカル環境ではIEでも正しく表示されるため、 ブログにアップした際乱れるのは、スタイルシートの影響かと考えております。 自分でそれらしいところをいろいろ設定をいじりましたが改善しません。 ということで、 ≪スタイルシートの設定で、画像を枠に使ったテーブルの隙間に影響を与えうる要素≫ が何が考えられるか教えて頂ければと存じます。 なお、使っているStyle Sheetは以下のものですが、 http://blog-imgs-30-origin.fc2.com/w/m/k/wmks/wm_gienah_R.html TableにかかわるStyle部分はコメントアウトしましたので、テーブル自体のスタイルは 適用されていないはずです。

    • ベストアンサー
    • CSS
  • テーブル内の背景画像を、20秒後に(読み込み)表示させたい。

    こんばんは。いつもお世話になっております。 テーブルの中に、背景画像を使用しています。 テーブルは横2縦1のセルになっており --------- ┃A ┃B ┃ --------- になっております。 このテーブルの背景を、20秒後に表示させたいのですが このような事は可能でしょうか? 可能か不可能か教えて頂けるだけでもありがたいです。 どうかご指導よろしくお願い申し上げます。

  • テーブルの隙間について

    テーブルについてあまり理解できていませんが、理解しようとやってはみるもののうまくいきません。 今までビルダーの6ではなんとなくできたからこれでいいやでやってきました。ですからテーブルなど自分がややこしいと思ったものは使わずにきました。 ですがホームページビルダー10を手に入れ、今ホームページをリニューアル中でして、今回は自分で満足できるものを作りたいと思っています。 ですがテーブルがどうもうまくいきません。 セルとセルの繋がるところがうまくいかず画像を入れると隙間ができてしまいます。罫線の幅を0にして枠表示のチェックもはずしているのですが画像が繋がってくれません。 どうしたらよいのでしょうか? よろしくお願いいたします。

  • セルの枠が全て1pxのtableの書き方

    セルの枠が全て1pxのtableってどうやって書くんでしょうか? 普通にtableのプロパティをいじっていて、cellspacing = "0" にしてボーダーを表示させると2pxの枠ができてしまいます。 そのため私はtableの背景に色を設定して、cellspacing = "1" にしてboroder="0"にします。これだとセルの枠の隙間がちょうど1pxになるので1pxの枠ができるtableになるのです。しかしこのやり方に疑問をもって質問しました。

    • ベストアンサー
    • HTML
  • ulでの段組の際の隙間

    お世話になります。 現在CSSで段組を行っているのですが、リスト(ul)で画像を縦に並べてメニューを作成しようと思っています。 liにはheightやmarginやpaddingなどをきちんと隙間なく並べるように書いて、imgにはvertical-align:bottom;を設定しています。 それでも、IE6.0で見たときどうしても1pxの隙間ができてしまうのです。 どうしてだろうと思い、画像の高さが25pxのものを作成し、liのheightに25pxを設定して(他は上記のCSSでいじらずに)表示すると、きちんと隙間ができずに表示されました。 隙間ができてしまうときのメニュー画像は高さ15pxのものを使用していて、liのheightを15pxと設定していました。 今までCSSで組んだときはきちんと隙間があくことなく表示できたのですが、今回だけどうしても隙間があいてしまいます。 メニューのリストで、使用する画像は小さいときは隙間があいてしまう、というようなバグがIEにあるのでしょうか。 もしそれがバグの場合は一言お教えいただけないでしょうか。 解決方法がなければしょうがないのでテーブルを使用しようと思います。 どうぞよろしくお願いいたします。

    • ベストアンサー
    • HTML
  • テーブルのセル内を半透明に

    縦2段×横3マスのテーブルに背景画像をつけ、6マスのセルはそれぞれ半透明の白色の背景にしたいのですが、宜しければタグを教えて頂けないでしょうか。 色々なHP作成支援サイトを参考にさせて頂いたのですが、パソコン初心者の為、よく分かりませんでした。 お手数をおかけしますが、教えて頂けますと嬉しいです。 宜しくお願い致します。

    • ベストアンサー
    • HTML
  • tableの記述方法について質問をしたいので、よろしくお願いします。

    tableの記述方法について質問をしたいので、よろしくお願いします。 http://desktop10.web.fc2.com/test2.html tableを使い、上記のような左側に180px、右側に600pxの枠を作成したいと考えております。その場合どういった記述が必要でしょうか? また、作成後(A)の枠に文字や、画像を入れていった場合必然的に(B)の枠に入力しているテキストや画像なども (A)の枠に合わせて下がっていってしまいます。 このような状態を無くす事は出来ないものでしょうか? お手数では御座いますがご指導のほどよろしくお願いいたします。

    • ベストアンサー
    • HTML
  • Dreameweaver テーブルの作成について

    お世話になります。 Dreamweaverでのテーブルの作成について質問させていただきます。 2行3列のテーブル。 (1列目幅30ピクセル2列目幅740ピクセル3列目幅30ピクセル) 2行目は3列を結合させて1つのセルにしています。 そこに横幅800ピクセル画像を挿入しています。 けれどもどうしても、画像とテーブルの間に隙間が開いてしまっています。 レイアウトモードでみると800(801)となっています。 この()の意味と、どのようにしたら画像の幅とテーブルの幅がぴったりになるのでしょうか。 初心者で、質問が上手くできていないかもしれませんが、宜しくお願い致します。

  • Windowsでテーブルが下に下がる

    Dreamweaver8でホームページを作成中です。 Mac OSX、SafariとInternetExplorer5.5で表示の確認をしています。 あるページにテーブルで画像を並べているのですが、 (画像一つのサイズは110px×110px程度、横6マス×縦7マス) Macでは正常に表示されるのですが、WindowsのInternet Explorer6.0で 見ると、テーブルごと40pxほど下にさがって表示されてしまいます。 テーブルを入れ子にしてみたりいろいろしてみたのですが、どうしても なおりません。 この場合、どのような原因が考えられるでしょうか? 補足もいたしますのでアドバイスいただけるとありがたいです。 宜しくお願いします。

    • ベストアンサー
    • HTML
  • テーブルに背景画像を入れたいのですが……

    CS5でホームページを作っていますが、CSSとかhtmlはまったくといっていいほど理解していません。 テーブルを挿入して組みあせているだけの初歩的な作り方なのですが、いろいろわからないことばかりです。 質問ですが、ページ全体への背景画像はできるのですが、テーブルに対する背景画像の設定は可能でしょうか。 下記のページのテーブル内の挿入画像をいくつか背景画像にして、その上にテキストを入れたいのです。 http://www.kajimaya.info/ http://ryukyugeino.jpn.com/ すみませんが、超初心者向きのご教示をいただければありがたいです。 どうかよろしくお願いします。

専門家に質問してみよう