From the course: CSS: Display
Unlock the full course today
Join today to access over 24,800 courses taught by industry experts.
Display: none vs. visibility: hidden - CSS Tutorial
From the course: CSS: Display
Display: none vs. visibility: hidden
- [Lecturer] Display none is one of CSS's favorite tricks and it's likely one you're already familiar with. I'll demo it for you anyway. But chances are you're probably familiar with it. But there's also another property called visibility, with a value of hidden. Sounds like the same thing. Doesn't it? Well, there are subtly different. So let's look at that difference now. So here inside of this CodePen, this is the same sort of section with the heading and the paragraph with some inline elements inside of it that you've seen before. I'm going to go ahead and write some CSS here to demonstrate this. So for example if I say strong, let's take all of the strong tags and let's display none. As you'll see here, all of the strong texts simply disappears. Notice that the space that it used to occupy has also disappeared. So if I set this back to inline, which is its default value, you'll see there are all that text comes…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.