What is the goal of overflow: hidden; service?

I have a webpage with a title bar in the middle. Elements are part of the header. Can someone explain what the overflow is: hidden; here. I donโ€™t understand why I need this or what he does.

Thanks,

#hdr_mdl { margin: 0 auto; overflow: hidden; width: 980px; z-index: 10; height: 50px; } 
+4
source share
5 answers

overflow:hidden prevents scrollbars from showing even if they are needed.

Explanation of your CSS:

  • margin: 0 auto horizontally aligns the element in the center
  • overflow:hidden prevents scrollbars
  • width:980px sets the width of the element to 980px .
  • z-index:10 causes the element to remain on top of elements without specific z-index , * or- elements with z-index below 10 or elements with z-index of 10, but defined before the element
  • heigh:50px - height 50px .
+5
source

If the content in #hdrPmdl was to spill more than 50 pixels, it would not allow the browser to insert scrollbars in the DIV. If the DIV does not contain dynamic content, and the size always remains static, then probably it is not needed, because the content will not be> 50px

0
source

Overflow Property Explanation: CSS Overflow Property

Interactive example of the overflow property: Play it

0
source

overflow indicates what the browser should do when the content is larger than the block size. overflow:hidden means "hide it and keep the initial block size."

0
source

if you use overflow hidden for certain content than overflow for that content and the rest of the content will be invisible. To find out, visit w3school http://www.w3schools.com/cssref/pr_pos_overflow.asp

0
source

All Articles