ここから本文です

解決済みのQ&A

3つのバナーを横1列に並べる方法教えてください!

tamaki517さん

3つのバナーを横1列に並べる方法教えてください!

3つのバナーを横1列に並べたいのですが、どうしても2個目と3個目がそれぞれ縦に並んでしまいます。
どなたか、横一列に並べる方法を教えていただけませんでしょうか?


<a href="http://www.tanken.ne.jp/cate/fethnic/ranklink.cgi?id=tama">
<img src="http://tanken.ne.jp/img/bana2/fethnic88_31.gif" border="0"><br>
エスニック系<br>( WEB SHOP 探検隊 )</a>





<!-- e-shops 投票バナー ここから -->
<TABLE border="0" cellpadding="0" cellspacing="0" style="border: 2px #cccccc outset; word-break:normal;"><TR><TD style="background-color:#010166; text-align : center;"><A href="http://www.e-shops.jp/sh/rk1/html/" target="_blank"><IMG src="http://img.e-shops.jp/vt/img201.gif" width="95" height="15" border="0" alt="レディース・ファッション"></A></TD></TR><TR><TD style="background-color:#010166; text-align : center;" nowrap><A href="http://www.e-shops.jp/sh/rk1/html/" style="font-size : 11px; text-decoration : none;font-weight: normal;background-color:#010166; color: #ffffff; line-height:110%;" target="_blank">レディース・ファッション</A></TD></TR></TABLE>
<!-- e-shops 投票バナー ここまで -->





<A HREF="http://www.kaipara.net/" target="_blank"><IMG
SRC="http://www.kaipara.net/imgs/banner8831.gif" alt="
ネットショップ検索" border="0"></A><br>

  • 質問日時:
    2008/1/23 22:54:04
  • 解決日時:
    2008/1/28 22:10:12
  • 閲覧数:
    3,172
    回答数:
    3
  • お礼:
    知恵コイン
    500枚

ベストアンサーに選ばれた回答

kenchinpon0429さん

下記のようにテーブルで組んであげると横一列に表示できます。

<table cellspacing="0" cellpadding="0">
<tr>
<td>
<a href="http://www.tanken.ne.jp/cate/fethnic/ranklink.cgi?id=tama">
<img src="http://tanken.ne.jp/img/bana2/fethnic88_31.gif" border="0"><br>
エスニック系<br>( WEB SHOP 探検隊 )</a>
</td>



<td>
<!-- e-shops 投票バナー ここから -->
<TABLE border="0" cellpadding="0" cellspacing="0" style="border: 2px #cccccc outset; word-break:normal;"><TR><TD style="background-color:#010166; text-align : center;"><A href="http://www.e-shops.jp/sh/rk1/html/" target="_blank"><IMG src="http://img.e-shops.jp/vt/img201.gif" width="95" height="15" border="0" alt="レディース・ファッション"></A></TD></TR><TR><TD style="background-color:#010166; text-align : center;" nowrap><A href="http://www.e-shops.jp/sh/rk1/html/" style="font-size : 11px; text-decoration : none;font-weight: normal;background-color:#010166; color: #ffffff; line-height:110%;" target="_blank">レディース・ファッション</A></TD></TR></TABLE>
<!-- e-shops 投票バナー ここまで -->
</td>



<td>
<A HREF="http://www.kaipara.net/" target="_blank"><IMG
SRC="http://www.kaipara.net/imgs/banner8831.gif" alt="
ネットショップ検索" border="0"></A><br>
</td>
</tr>
</table>

テーブルのサイズや余白は、cellspacing="枠と枠の隙間"や、
cellpadding="枠内の余白"、with="テーブルのサイズ"の値でカスタマイズできます。

また、バナーの並びの高さを上段に合わせたり、中央揃えなどの、表示は
align="横位置" valign="縦位置"でカスタマイズできます。

下記を参考にしてみて下さい。。
http://heo.jp/tag/table/index.html

質問した人からのお礼

  • 成功とても詳しく教えていただきありがとうございます!
    色々自分でも調べてみたのですが、いまいち良くわからなくて...
    とても助かりました。ありがとうございました!
  • コメント日時:2008/1/28 22:10:12

グレード

ベストアンサー以外の回答

(2件中1〜2件)

並べ替え:回答日時の
新しい順
古い順

 

adsldenetさん

<ul style="list-style-type:none">
<li style="float:left">
<a href="http://www.tanken.ne.jp/cate/fethnic/ranklink.cgi?id=tama">
<img src="http://tanken.ne.jp/img/bana2/fethnic88_31.gif" border="0"><br>
エスニック系<br>( WEB SHOP 探検隊 )</a>
</li>



<li style="float:left">
<!-- e-shops 投票バナー ここから -->
<TABLE border="0" cellpadding="0" cellspacing="0" style="border: 2px #cccccc outset; word-break:normal;"><TR><TD style="background-color:#010166; text-align : center;"><A href="http://www.e-shops.jp/sh/rk1/html/" target="_blank"><IMG src="http://img.e-shops.jp/vt/img201.gif" width="95" height="15" border="0" alt="レディース・ファッション"></A></TD></TR><TR><TD style="background-color:#010166; text-align : center;" nowrap><A href="http://www.e-shops.jp/sh/rk1/html/" style="font-size : 11px; text-decoration : none;font-weight: normal;background-color:#010166; color: #ffffff; line-height:110%;" target="_blank">レディース・ファッション</A></TD></TR></TABLE>
<!-- e-shops 投票バナー ここまで -->
</li>



<li style="float:left">
<A HREF="http://www.kaipara.net/" target="_blank"><IMG
SRC="http://www.kaipara.net/imgs/banner8831.gif" alt="
ネットショップ検索" border="0"></A><br>
</li>
</ul>

m0o0m_12omotさん

例えば、こんな感じにしたいのかな?

<TABLE border="0" cellpadding="0" cellspacing="0" style="border: 2px #cccccc outset; word-break:normal;">
<TR>
<TD>
<a href="http://www.tanken.ne.jp/cate/fethnic/ranklink.cgi?id=tama">
<img src="http://tanken.ne.jp/img/bana2/fethnic88_31.gif" border="0"></a>
<TD style="background-color:#010166; text-align : center;"><A href="http://www.e-shops.jp/sh/rk1/html/" target="_blank"><IMG src="http://img.e-shops.jp/vt/img201.gif" width="95" height="15" border="0" alt="レディース・ファッション"></A></TD><TD style="background-color:#010166; text-align : center;" nowrap><A href="http://www.e-shops.jp/sh/rk1/html/" style="font-size : 11px; text-decoration : none;font-weight: normal;background-color:#010166; color: #ffffff; line-height:110%;" target="_blank">レディース・ファッション</A>
</TD>
<TD><A HREF="http://www.kaipara.net/" target="_blank"><IMG
SRC="http://www.kaipara.net/imgs/banner8831.gif" alt="
ネットショップ検索" border="0"></A>
</TD>
</TR>
</TABLE>

Q&Aをキーワードで検索:

総合Q&Aランキング

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。

知恵コレに追加する

閉じる

知恵コレクションをするID/ニックネームを選択し、「追加する」ボタンを押してください。
※知恵コレクションに追加された質問や知恵ノートは選択されたID/ニックネームのMy知恵袋で確認できます。

ほかのID/ニックネームで利用登録する