【 HP作成質問箱 】
| Page-1
【HP作成質問箱/詳細】 一覧 / 詳細
-
No.9870 2枚の画像を隙間なく並べたい。
[まこじ] [ブラウザ] 09/02/02 (月) 16:08
-
▼ ▼ ▼
-
No.9871 Re:2枚の画像を隙間なく並べたい。
[atom] [ブラウザ] 09/02/02 (月) 16:31
-
これは単純にimgタグ間にある「改行」がスペース1個分に置き換わってるからです。
「改行」を削除して1行に記述すれば隙間はなくなると思います。
それとそれでも2行に跨るのなら、それはブラウザの持つ、「自動折り返し」機能です。
横幅を超えたものは自動的に次の行に表示されてしまいます。
これを解決するには、divタグの横幅を広く取るか、
divタグに「white-space: nowrap;」のスタイルを入れるか、
テーブルタグのセルで1個1個括ってやればいいです。▼ ▼ ▼ -
No.9872 Re^2:2枚の画像を隙間なく並べたい。
[まこじ] [ブラウザ] 09/02/02 (月) 19:42
-
改行は縦にも横にもスペースを空けるのですね。
勉強になりました。
ありがとうございます。▼ ▼ ▼
-
No.9871 Re:2枚の画像を隙間なく並べたい。
| Page-1
width属性を指定しないと横に並びますが、2枚の間に隙間が出来てしまいます。
どうすれば2枚の間に隙間を作らずに横に並べられるでしょう。
**** test_01.html ****
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html lang="ja" xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head xmlns=">
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
<link href="test_01.css" type="text/css" rel="stylesheet" />
</head>
<body xmlns=">
<div class="wrapper">
<img class="02" alt="無料査定スタート" src="01_02.jpg" />
<img class="03" alt="買取金額の目安表" src="01_03.jpg" /><br />
</div>
</body>
</html>
**** test_01.css ****
div.wrapper {
margin: 0px auto;
padding: 0px;
text-align: center;