Hide a div that is part of all pages on one specific page

1 Views

How can I hide a div (which contains an image) for a specific WordPress page?

I believe my page id is 46:

Read More

enter image description here

Here is the div I am trying to change: 

<div id="static-footer-image" style="position:absolute; bottom: -15px; z-index: 501;">
    <img src="images/background-bottom.png"/>
</div>

And the associated CSS code in my main CSS file: 

#static-footer-image body.page-id-46 { 
     display: none; 
}

It is still showing. What do I do to fix this?

Post Views: 1

Related posts

6 comments

  1. Guess from the URL structure, your %postname% permalink structure is active. So, a bit of internal CSS can help alternatively, and the syntax is in_page('page_slug'):

    <?php // Do action only on specific page in WP ?>
<?php if( in_page('resourses') ) { ?>
<style>
  #static-footer-image{
      display: none;
  }
</style>
<?php } ?>

  2. Use following CSS

    body.page-id-46 #static-footer-image { 
     display: none; 
}

    and make sure “page-id-46” class is applied to body tag and Clear the cache. May be try on another browser or a incognito window.

  3. If that’s the page ID, the selector should be

    body#page-id-46 #static-footer-image

    not 

    body.page-id-46 #static-footer-image

  4. You may have a display in CSS so you may try:

    body.page-id-46 #static-footer-image { 
     display: none !important; 
}

  5. This works for me:

    body .page-id-46 #static-footer-image { 
     display: none; 
}

    not this: 

    body.page-id-46 #static-footer-image { 
     display: none; 
}

    After body give a space and type .page-id-46 #static-footer-image{display: none;}
    Once again check whether it’s a class or id.
    in my case, it’s an id, here is my code for your reference:

    body #post-448 .entry-meta-bar
{
    display:none;
}

    Hope this will help you.

  6. How would the code look if you wanted to exclude a widget?

    The CSS:

    body.page-id-60748,
.widget_its-single-post { 
     display: none !important; 
}

Comments are closed.