How to hide all element on html page except one div using css?


Tags: html,css

Problem :

I was trying to hide all on an html expect for one <div>, as part of a bigger problem. I have tried...

body * {
  display: none;
}
#someTable, #someTable * {
  display: block !important;
}

But It doesn't work. What am i doing wrong?



Solution :

You can use the pseudo-class ':not()'

<style>
   body *:not(.myDiv) {
        display: none;
    }
</style>


<div>1</div>
<div class="myDiv">2</div>
<div>3</div>

    CSS Howto..

    how to use font awesome in own css?

    CSS/JQuery: how to create submenu for table row that stays visible mousing from row onto menu?

    How to include css and jquery in joomla component

    How to shift divs “up” in an order after deleting hiding a div with jquery/css

    How can I add a pulse animation to a div in an array of divs, in Javascript?

    How to use CSS Loader in my website?

    How to add a banner inside a div at the bottom?

    How to add hover text on D3 disign?

    jQuery - Navbar hover did not show

    How to have a horizontal line at the middle of a html heading with CSS?

    How to display shopping cart at the right of page

    How to keep floated width of divs to stay exact instead of 100%?

    How to overlap a CSS background over an tag?

    How to equally align two vertical columns created using a loop, an array, and appending childs in JavaScript (or CSS)?

    html, css - how to use display: inline-block

    How do I get my textboxes to align properly once triggered? - jQuery/CSS

    how to creating a separator line which is always in the middle (center)

    How to make my div align in CSS?

    How to convert 1 column records of dynamic table into hyperlink

    How can I get this toggled drop down menu to be open by default - rather than having to have someone click it to initialize it?

    how to keep elements in one row in css

    How do I put a border: 1px solid #ddd around a selectbox using jQuery?

    CSS : How to have an input field auto adjusting its width

    How to provide default font height or content when

    or has no characters?

    angular ngShow with animate.css

    JavaScript -Change CSS color for 5 seconds - How to add easing effect?

    Creating a calendar control using CSS: How to auto layout events

    How to do proper and responsive Image Grid view with display:flex [duplicate]

    Tag name in CSS selector (e.g. div#id): how is it read? (Left to right or right to left?) [duplicate]

    How to make text flow from left right bootstrap