2010-11-29 8 views
1

私はこのようなコードがある場合:HTML、CSS、フローティングイメージマージン?

<p> 
    Some long text 
    <img src="src" style="float: right" /> 
    the rest of the text 
</p> 

を、私は以下のように奇妙な赤い領域を取得しています。それを避ける方法は? pとimgにはマージンとパディングがありません(imgの上の画像には5pxの左と下のマージンがあります)。最初の赤い部分については

Image Float Problem

+0

CSSの残りの部分が見えないのは、私が本当に助けることはできません。しかし、おそらく明示的に 'margin:0px;パディング:0px; 'そこに? –

+0

私はそれが奇妙なデフォルトの動作だと思います。 Imgには段落のようなマージンとパディングはありません。パラグラフに余白やパディングがある場合でも、パラグラフの一部であるため、テキストと画像の両方に影響するはずです。 – fomicz

+0

これで試してみましたか?

答えて

3

、私は完全なHTMLとCSSを見ずに何が起こっているか見当がつかない。 2番目の赤い領域(画像の下)は削除できません。あなたのブラウザは画像の近くにテキストを配置することはできませんので、代わりにそのギャップを残します。

+0

浮動小数点要素は自動的に要素をブロックします。 – alex