Very strange! As long as there is an img element in the previous div element. The following div will overlap the previous element, or automatically float left. Find the solution! _html/css_WEB-ITnose

I have been troubled by this problem these days. Let me give you a similar code,
xhtml code:

css code:
#img img { display:block}
#footer {width:800px; height:40px; background:red; margin-top:30px}
Why is the upper margin of footer invalid? Sometimes the footer will overlap the previous div. Why? This happens every time when the previous div contains img. Don't the elements in the div listen to the parent element? ? ? Why? It annoys me to death! (This post was posted once yesterday. But I missed a symbol, and someone else responded. The answer was that I missed a symbol. So I had to repost it once.)

Reply to discussion (solution)

What’s even weirder is that I tested it in multiple browsers and the margin-top is normal. . I don’t know which browser the poster is using?
Also, how is DTD written?

There is no problem with these lines of code. Find the problem with other codes. It's a problem with other style positioning.

If your page only contains the code you gave as an example, would that be the case as you mentioned?
You need to debug, delete all irrelevant content, and then add it bit by bit to see what affects it

What’s even weirder is that I tested it in multiple browsers, margin -top are all normal. . I wonder which browser the poster is using?
Also, how is DTD written?
Document type:
The browsers are IE8, Firefox 3.6 and Google Chrome.

If your page only contains the code you gave as an example, would that be the case as you mentioned?
You need to debug, delete all the irrelevant content, and then add it bit by bit to see what affects it
Let me give it a try

I also encountered this problem with two divs I stacked them together, and I’m so worried that nothing is right until now