CSS1 テストスイート: 5.5.25 float

下記のテキストに適用されるスタイル宣言は、つぎのとおりです。

P.test {background: white; font-size: 20px;
        margin-left: 30px; margin-right: 10px; padding: 0; border: 0;}
IMG {padding: 0; border: 0; margin: 0;}
P.test IMG {float: left;}
#img2 {margin-top: 30px; margin-left: 30px;}
#img3 {margin-top: -30px; margin-left: -30px;}
#img4 {margin-right: 30px; margin-bottom: 30px;}
#img5 {margin-right: -30px; margin-bottom: -30px;}

この段落には白色の背景があるはずです。 この背景は、要素のボックスの縁まで広がっているものです。 いずれにせよ、この段落にはパディングが設定されていません。 ボックス全体の背景が白色でないならば、これが以下のテストに問題を引き起こすかもしれません。 多かれ少なかれ、それは考慮に入れなければなりません。

この段落の左上隅の画像は左に浮遊し、またそれよりも左に浮遊するものはないはずです。 白色の背景の縁は、画像の上縁や左縁と並ぶはずです。 この段落には、何よりも先に白色の背景があるはずです。 この背景は、要素のボックスの縁まで広がっているものです。 いずれにせよ、この段落にはパディングが設定されていません。

この段落の左上隅の画像は、段落のボックスの左上隅から下と右とへそれぞれ30ピクセル動かされており、それに応じて段落テキストを置き換えているはずです。 この段落には、何よりも先に白色の背景があるはずです。 この背景は、要素のボックスの縁まで広がっているものです。 いずれにせよ、この段落にはパディングが設定されていません。

この段落の左上隅の画像は、段落のボックスの左上隅から上と左とへそれぞれ30ピクセル動かされており、そのため、白色の背景の縁が画像の中の灰色の太い線に揃えられているはずです。 この段落には、何よりも先に白色の背景があるはずです。 この背景は、要素のボックスの縁まで広がっているものです。 いずれにせよ、この段落にはパディングが設定されていません。

この段落の左上隅の画像は左に浮遊させられており、白色の背景の縁は画像の左縁や上縁と並ぶはずです。 しかしながら、画像の右縁や下縁と、その周りにある段落テキストとの間には、30ピクセルのスペースがあるはずです。 この段落には、何よりも先に白色の背景があるはずです。 この背景は、要素のボックスの縁まで広がっているものです。 いずれにせよ、この段落にはパディングが設定されていません。

この段落の左上隅の画像は左に浮遊させられており、白色の背景の縁は画像の左縁や上縁と並ぶはずです。 しかしながら、テキストは、画像の右側や下側と重なって、画像の中の灰色の太い線に並んでいるはずです。 この段落には、何よりも先に白色の背景があるはずです。 この背景は、要素のボックスの縁まで広がっているものです。 いずれにせよ、この段落にはパディングが設定されていません。