Jump to content

Archived

This topic is now archived and is closed to further replies.

travistsickle

remove metabar on mobile

Recommended Posts

travistsickle

If I put 

.metabar { display: none;} 

 

in the custom css section, then the metabar is removed from my entire site.  I have a section setup only for my blog on mobile devices.  I want to delete the metabar only from this particular section.

 

I see how to do a custom background, font size and color but can't figure out how to do this one.

Share this post


Link to post
Share on other sites
James B

Hi there, to hide the metabar only on a mobile device you can use @media queries in the css. Please see http://forum.pagelines.com/topic/30582-how-to-override-media-queries-in-dms-pro/ which has a great example of how to do this.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
travistsickle
I added this code to the css custom and the metabar was deleted from my phone but not ipad.  I added nothing to the css custom styling classes on the section.  So I am confused at what to do.
 
@media (max-width: 767px) {
  #site .metabar {
    display: none;
  }
}

Share this post


Link to post
Share on other sites
James B

@media queries allow you to make specific changes based on the size of the screen on the device. So in that instance it's hidden it on the phone as the screen is under 767px. An ipad it still displays as that screen is above 767px.

 

A list of sizes can be found at http://css-tricks.co...andard-devices/ to enable you to make changes on other devices.

 

Anything added to the custom css can be used to overule/change elements on the site. In this case you're overriding the class .metabar, so you don't have to put in a custom class in to the section, you're using the class thats in the core files already.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites

×