2

I'm trying to make parts of a list hidden when the page loads.
Specifically the sdt_wrap class of my HTML.
I know that the display:hidden is in the correct spot it just is not taking in the hidden value

Here is the CSS:

ul.sdt_menu li span.sdt_wrap{
    position:absolute;
    top:25px;
    left:50px;
    width:170px;
    height:150px;
    z-index:501;
    display: hidden;
}
Improve this question
3
  • Possibly being overridden by higher level CSS selectors, based on specificity. I'd check firebug to see what's overriding it, and set up a higher specificity order (#content ul.sdt_menu.... for example).
    – jeffkee
    Commented Jun 18, 2012 at 19:09
  • developer.mozilla.org/en/CSS/display
    – j08691
    Commented Jun 18, 2012 at 19:10
  • Wow. 8 years ago this was asked
    – RingGamesCompany
    Commented Aug 25, 2020 at 2:07

3 Answers 3

Reset to default
17

hidden is not a valid value for display. You're looking for none, as in:

ul.sdt_menu li span.sdt_wrap{
    display:none;
}

Documentation

CSS display on MDN - https://developer.mozilla.org/en/CSS/display

Improve this answer
15

It's display:none or visibility:hidden. 'hidden' is not a valid value for 'display'.

Improve this answer
1

use visibility:hidden; or opacity: 0; property

Improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.