Problem with hidden code

I can’t understand why when I delete the overflow: hidden; in UL the whole header disappears. does anyone know: D

https://www.w3schools.com/css/tryit.asp?filename=trycss_float5 This is a link :smiley:

Hi,

Floats are ‘effectively’ removed from the flow and a parent that holds only floats will have no height and it’s background will not be seen.

Overflow hidden creates a new block formatting context and in that context it will automatically contain its child floats. There are other methods to contain floats (Google the clearfix method).

These days there are better ways of laying out content without using floats and avoid float containment issues. Use flex box instead and only use floats when you explicitly want that float behavior of content wrapping around a float.

1 Like