Home css Overflow: hidden doesn't work

Overflow: hidden doesn’t work

Author

Date

Category

Hi! property overflow: hidden in example menu does not work

https://jsfiddle.net/Lnqhgu9y/

a piece of code that doesn’t work

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

What to do to crop a long menu at the bottom of the footer?


Answer 1, authority 100%

You have hidden on a UL element that does not have a fixed height.

If you want to crop to footer, create a main container and overflow: hidden; assign to it. And also remember to use position: relative (or others) along with overflow.

Add to CSS:

. container {
 position: relative;
 overflow: hidden;
}

Add to HTML (after body):

& lt; body & gt; & lt; div class = "container" & gt;

Add to HTML (before / body):

& lt; / div & gt; & lt; / body & gt;

Using your example: https://jsfiddle.net/Lnqhgu9y/7/

Programmers, Start Your Engines!

Why spend time searching for the correct question and then entering your answer when you can find it in a second? That's what CompuTicket is all about! Here you'll find thousands of questions and answers from hundreds of computer languages.

Recent questions