Hiding Extraneous Elements

Sometimes the easiest way to get rid of a problem element on your Web page that just doesn’t look right on the small screen is to hide it all together.

To hide elements:

1.
Type the selector that identifies the elements you want to hide.
2.
Type {display: none} to completely remove them from the flow of the document.

✓ Tips

  • For more details about the display property, consult Displaying and Hiding Elements on page 190.

  • I have found the display property to be well supported by the handheld browsers that support CSS at all. I did have one problem with a browser that didn’t like contextual selectors: h1 {display: none} worked fine, #header h1 {display:none} did not.

  • Note that just because you hide an element doesn’t mean ...

Get HTML, XHTML, & CSS, Sixth Edition: Visual QuickStart Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.