Ads By Google
画像の中央揃えが出来ません。
こちらのブログなのですが、
ご覧のようにインフォトップの
売り上げ画像が右にずれています。
<center><img src=" ; width="618" height="83" border="0" alt="2008y10m07d_161916765" hspace="5" class="pict" /><br /></center>
このように中央揃えのタグで挟んでみたのですが、
直りません。
綺麗に中央に収まる方法を教えてください。
よろしくお願い致します。
2008-10-07 16:46の質問
この質問と回答を読んで役に立った場合は「役に立つ質問」に投票してください。投票が多い質問は、役に立つ質問一覧に掲載され、より多くの人に見てもらうことができます。
回答(1)
1.
2008-10-08 01:56:27

中央揃いができないんではなくて、画像横幅が大きすぎて、
記事投稿部分の中央に収める事ができないというのが、
原因のようです。
現在の、画像むかって左端の部分が限界点です。
<center> タグにしたがって中央に寄ろうとしているんですが、
画像の中心部分がセンターにくる前に、左端に限界点が
きてしまい、中央に寄れずに画像はストップ。
・・・ って感じでしょうか。だから右に寄っているように感じて
しまうんですが、あの状態で画像はセンターの限界まで頑張って
寄ってくれています。右サイドカラムに引っ付いてしまっている
のも、画像横幅が大きすぎるからです。
■ 解決策としては、今の画像の大きさのまま、強制的に左に寄せたい
のであれば <margin> を使ってマイナス指定をする方法がありますが
左サイドカラムが下に落ちるような事があれば、やめて下さい。
以下のタグで、画像を設置して下さい。マージンの数値は
だいたい計算しておきました。( カンですけど ww )
質問に書かれているタグは、<br/> の位置がおかしいです。
</center> の外側に。回答の中では、</div> の外側に記入しています。
class="pict" は、センター揃いの場合はいらないでしょう。
外しておきました。
■ もうひとつの解決策は、画像を小さくする事。
サイズ指定してもいいですが、width="590" height="78" ぐらいで
設定すると、中に書かれている文字が潰れます。
画像作成ソフトで、キレイに作り直したほうが良いと思います。
上記の方法で、お試しください。
記事投稿部分の中央に収める事ができないというのが、
原因のようです。
現在の、画像むかって左端の部分が限界点です。
<center> タグにしたがって中央に寄ろうとしているんですが、
画像の中心部分がセンターにくる前に、左端に限界点が
きてしまい、中央に寄れずに画像はストップ。
・・・ って感じでしょうか。だから右に寄っているように感じて
しまうんですが、あの状態で画像はセンターの限界まで頑張って
寄ってくれています。右サイドカラムに引っ付いてしまっている
のも、画像横幅が大きすぎるからです。
■ 解決策としては、今の画像の大きさのまま、強制的に左に寄せたい
のであれば <margin> を使ってマイナス指定をする方法がありますが
左サイドカラムが下に落ちるような事があれば、やめて下さい。
以下のタグで、画像を設置して下さい。マージンの数値は
だいたい計算しておきました。( カンですけど ww )
<div style="margin-left:-17" align="center"> <img src="http://image.blog.livedoor.jp/ritto11/imgs/8/8/883b16c7.jpg" border="0" alt="2008y10m07d_161916765" hspace="5" width="618" height="82"/> </div><br/>
質問に書かれているタグは、<br/> の位置がおかしいです。
</center> の外側に。回答の中では、</div> の外側に記入しています。
class="pict" は、センター揃いの場合はいらないでしょう。
外しておきました。
■ もうひとつの解決策は、画像を小さくする事。
サイズ指定してもいいですが、width="590" height="78" ぐらいで
設定すると、中に書かれている文字が潰れます。
画像作成ソフトで、キレイに作り直したほうが良いと思います。
上記の方法で、お試しください。
回答レベル : 回答
教えていただいた方法で
試してみましたが、自分のイメージ通りに
行かなかったので、この画像は載せないことにしました。
しかし、とても親切で丁寧な回答を
下さって、とても嬉しかったです。
本当にありがとうございました。
とても参考になりました。
Ads By Google
コメント(3)
#1. HS
2008-10-07 17:17:02
「累計売上」ってヤツですよね(?_?)
IE7 と FireFox では真中に表示されてますが?
#2. ゾーロク
2008-10-07 17:35:23
当方、Firefox3。
累計売上画像の上に他の画像が重なってます。
むしろ、右側の画像を下げるのでしょうね。
左側画像と累計売上画像の間も離れすぎているようです。
#3. AQ
2008-10-08 08:38:24
> りこちゃんさん
イメージどおりに、ならなかったんですか?
こちらで HTML を落として実際に検証してみて、良い感じに
なったんで回答したんですが、それは残念です。(>_<)
でも、ベストいただいて、ありがとうございます。(^^)
トラックバック(3)
パディングとマージン
2006年03月18日 AQ 『 ボックスと要素 』 の関連記事となります。先に説明したボックスを構成するものの中に、今回説明するパディングとマージンがあります。CSS ( スタイルシート ) を覗いているとやたら出てくるので、もうみなさんお馴染みの記号ではないでしょうか ...
Pet Lovers Only♪ at 2008年10月08日 02:29:17




