Basic CSS overriding the overflow: hidden; property

I have the following CSS class loa开发者_Python百科ding across all of my site:

html, body {
  // no scrollbars before iframe resize
  overflow: hidden;
}

How do I override this, so that overflow is visible on a specific html page?

---

For the pages you don't want overflow hidden, give body a specific id, like #nothidden. Then, use CSS that checks for it

body {
    overflow: hidden;
}
body#nothidden {
    overflow: auto;
}

The id is more specific so it will override the first one (but only when it applies, of course).

P.S. I don't think you should need to put overflow:hidden on the html element. Does that even do anything? Have you tried it without "html" and only "body"?

---

html, body {
    overflow: auto !important;
}

The "!important" will make it override just about any other declaration.

---

You should use !imporant for this:

html, body {
  // no scrollbars before iframe resize
  overflow: scroll !important;
}

Or you could give the body an id:

body#somePage{
  overflow:scroll;
}