html - there is an odd css issue, the text inside a div did not move with the div -


People

I have a simple page with a strange problem even two senior front Why do not find the developers here, the code is very simple and easy to understand

  & lt; Html & gt; & Lt; Top & gt; & Lt; Style type = "text / css" & gt; Body {padding-left: 250px; } # Box 1 {width: 150px; Height: 150px; Background color: # 063; Margin-bottom: 10px; Text-align: center; Line-height: 150px; Swim left; } # Box 2 {width: 150px; Height: 150px; Background color: # 00F; Margin-down: 15px; Text-align: center; Line-height: 150px; } # Box 3 {width: 150px; Height: 150px; Background color: # FC3; Text-align: center; Line-height: 150px; } & Lt; / Style & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Div id = "box1" & gt; Box 1 green & lt; / Div & gt; & Lt; Div id = "box2" & gt; Box 2 blue & lt; / Div & gt; & Lt; Div id = "box3" & gt; Box 3 yellow & lt; / Div & gt; & Lt; / Body & gt; & Lt; / Html & gt; Since the # box 1 float: Left, it will be at the top of the page, and # box 2 must be invisible (# 1 covered by box 1)  

However, when I see it from Firefox / Chrome, then I can still see the text of # box 2 and the text position is not correct.

I want to know why the text is appearing and how to fix it in the wrong place.

I appreciate your help.

Thanks Luke

just try the above link Set the position for your box 1

  Status: Full  

This works fine.

Cause:

Since you do not use any condition, it will be considered a static position rather than the default.

Static Status: The scroll of part of the page flow is not normally a position change.

Existing status: This page is out of flow, it is usually taken from the original position [0,0].


Comments

Popular posts from this blog

sqlite3 - UPDATE a table from the SELECT of another one -

c# - Showing a SelectedItem's Property -

javascript - Render HTML after each iteration in loop -