解決済
ＴＯＰ画像の下に画像を入れたらずれます；；
ＴＯＰ画像の下にメニューバーのようなものを入れたくて、下記のようにＨＴＭＬを追加し、画像は表示されたのですが、画像間に隙間が開いたりして右にずれてしまいます。修正する方法はないのでしょうか？教えてください。
回答(1)
2.
ＴＯＰ画像の下にメニューバーのようなものを 入れたくて、下記のようにＨＴＭＬを追加し、
ここまではわかります。
画像間に隙間が開いたりして
画像間の隙間は入れたくないのですね？
それとも任意の隙間があったほうが良いのでしょうか？
右にずれてしまいます。
実際にこれはデフォルトが左で右に寄っているのか、中央がデフォルトで右に寄っているのか、どちらなんでしょうか？
そしてコメント欄に書かれているタグを見てみると、<div id="bannermenu"> と id 属性を付けておられます。この属性に対してあなたの CSS はどういう指示をなさっているのでしょうか？
わざわざ属性を付けておられるという事は、必ず CSS での指示をもって表示状態を調整しているのだと考えられますが、その CSS の記述を教えて下さい。
そして、cellpadding="0"]> と cellpadding の右横の方に、『 ] 』 とわからない記述がありますが、これはこの質問のために画像アドレスなどを変更した時についてしまったものですか？ それとも現在のあなたの記述にも付いているのでしょうか？
また、これは単に画像 （ バナー ） を横に並べただけのメニューですよね？ ならば cellspacing="0" cellpadding="0" などの表記は入らないのですが・・・。結局表組みにもなっていません。
さらに、メニューと言う割には、リンクがかかっている画像は、２つ目と４つ目だけです？ 知らせていただく情報を割愛しましたか？
私ならこう記述しますが・・・。
字数制限の為コメント >>#3 に続きます。↓
※ 回答 >>1 は回答ではないので削除します。
難しいのですね・・・
でも、参考にと書いていただいた記述がすごく役に立ちました。
当初の予定とは多少違いますが、納得のいくものを作ることが出来ました。
時間がなくて、質問も返せずに失礼いたしました。
本当にありがとうございました。
コメント(5)
すいません＾＾； これです
<div id="bannermenu"><img src="http://image.blog.livedoor.jp/000.gif"; cellspacing="0" cellpadding="0">
<a href="http://ooo.ooo.jp/"><img src="http://image.blog.livedoor.jp/000.gif"; border="0" cellspacing="0" cellpadding="0"></A>
<img src="http://image.blog.livedoor.jp/000.gif"; cellspacing="0" cellpadding="0">
<a href="http://ooo.ooo.jp/"><img src="http://image.blog.livedoor.jp/000.gif"; border="0" cellspacing="0" cellpadding="0"]></a>
<img src="http://image.blog.livedoor.jp/000.gif"; cellspacing="0" cellpadding="0"]></div>
すいません＾＾； これです
<div id="bannermenu"><img src="http://image.blog.livedoor.jp/000.gif"; cellspacing="0" cellpadding="0">
<a href="http://ooo.ooo.jp/"><img src="http://image.blog.livedoor.jp/000.gif"; border="0" cellspacing="0" cellpadding="0"></A>
<img src="http://image.blog.livedoor.jp/000.gif"; cellspacing="0" cellpadding="0">
<a href="http://ooo.ooo.jp/"><img src="http://image.blog.livedoor.jp/000.gif"; border="0" cellspacing="0" cellpadding="0"]></a>
<img src="http://image.blog.livedoor.jp/000.gif"; cellspacing="0" cellpadding="0"]></div>
以下の回答は他の方に説明した、バナーを ４つ 並べて記述する方法を記したものです。参考にして下さい。↓
<div id="bannermenu"><a href="リンク先アドレス（1）"><img style="margin-right:5px" border="0" src="バナー保存先アドレス（1）" width="幅" height="高さ"></a><a href="リンク先アドレス（2）"><img style="margin-right:5px" border="0" src="バナー保存先アドレス（2）" width="幅" height="高さ"></a><a href="リンク先アドレス（3）"><img style="margin-right:5px" border="0" src="バナー保存先アドレス（3）" width="幅" height="高さ"></a><a href="リンク先アドレス（4）"><img border="0" src="バナー保存先アドレス（4）" width="幅" height="高さ"></a></div>
>>#4 に続く↓
img タグの中に書いてある、style="margin-right:5px" は、画像の右側に 5px の余白をあけなさいと命令しています。画像と画像がひっついたらカッコ悪いと思うのですが・・・。
もう少し大きく空けたかったら、数字を大きくして下さい。小さくしたかったら数字を小さく、もしくは削除しても結構です。一番最後の img には、その指示はしていません。右側に何も無いから必要ないですから。
この記述を HTML に施し、さらに CSS にこういう記述をしておきます。このメニューがセンターに表示される事を前提とします。
#bannermenu{
text-align:center;
margin:○○px auto □□px;
}
○○ は上への余白です。□□ は下への余白。auto は左右です。センター表示を前提としているので、auto のままで良いでしょう。
CSS、HTML ともに保存。再構築を必ず忘れずにおこなって下さい。
＞龍也様 さん
とりあえず、できたのですね？
それならば、良かったです解決して。
ベストありがとうございました (^^)
