Responsive CSS Settings Hellobar

pending (6 posts) (2 voices)

  1. brycewelker
    Member

    Hi,
    I would like to remove the HelloBar from the top of my website (crushtheeaexam.com) whenever it's being viewed in responsive mode. This is the code I was given to do so, however it doesn't seem compatible with the Elegance theme and doesn't change anything when I add it to the style.css file.

    /* Remove hellobar on mobiles ————————————— */

    @media only screen and (max-width: 700px) {
    #hellobar_container,
    #hellobar_pusher { display: none !important; }
    }

    Is there something else I need to delete/add here to make this work? (see attached style.css screenshot)

    Thanks,
    Bryce

    Attachments

    1. Screen_Shot_2014-11-25_at_4.19.55_PM.png (135.2 KB, 1 downloads) 2 years old
    Posted 2 years ago #
  2. Elliott
    Support

    Hello brycewelker,

    Try adding this in Dashboard > your theme > General Settings > Custom CSS.

    @media screen and (max-width: 700px) {
    #hellobar_container,
    #hellobar_pusher { display: none !important; }
    }
    Posted 2 years ago #
  3. brycewelker
    Member

    Just added that code to the Custom CSS field and the HelloBar is still appearing on mobile devices. What else might can we try here?

    Posted 2 years ago #
  4. Elliott
    Support

    Paste the full contents of your custom CSS field here.

    Posted 2 years ago #
  5. brycewelker
    Member

    .mysite_recent_widget .meta_date { display: none !important; }
    #fancy_search { display: none !important; }
    #sidebar .widgettitle { background: transparent !important; color: #00437f !important; font-size: 14px !important; text-transform: capitalize; }
    .post_more_link { background: none !important; color: #00437f !important; font-size: 12px !important; }
    #primary_menu { border-top: 1px solid #dadada !important; border-bottom: 1px solid #dadada !important; }
    .jqueryslidemenu a { padding: 11px 20px !important; text-transform: uppercase; }
    .single_post_content h2.post_title { display: none; }
    #header { height: 160px; !important; }
    .post_list { margin-top: 40px; !important; }
    @media screen and (max-width: 700px) {
    #hellobar_container,
    #hellobar_pusher { display: none !important; }
    }

    Posted 2 years ago #
  6. Elliott
    Support

    That's weird. It works fine when I add it in firebug. Not sure what's going on there. I would try contacting the plugin authors.

    Posted 2 years ago #

Reply

You must log in to post.

Construct WordPress Theme
Construct wordpress theme
Myriad WordPress Theme
Myriad wordpress theme
Method WordPress Theme
Method wordpress theme
Fusion WordPress Theme
Fusion wordpress theme
Elegance WordPress Theme
Elegance wordpress theme
Echelon WordPress Theme
Echelon wordpress theme
Dejavu WordPress Theme
Dejavu wordpress theme
Modular WordPress Theme
Modular wordpress theme