CODEWITHSUNDEEP
htmlcss
quantdaddy
quantdaddy

Reputation: 1474

float and positioned element stacking order

According to MDN and this blog, when z-index is not used, positioned elements should always stack over the float elements when they overlap. However, the example in the MDN link doesn't justify that. How come?

Upvotes: 1

Views: 93

Answers (1)

Gavin Thomas
Gavin Thomas

Reputation: 1206

The answer is in the link you provided: The stacking order is -

  1. Background and borders of the root element
  2. Descendant blocks in the normal flow, in order of appearance (in HTML)

As this stacking order is before any of the others, it take priority - so DIV#1 will be behind other floating & positioned DIVs, ignoring normal DIVs.

Upvotes: 1

Related Questions