Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • December 6, 2015 at 9:00 pm #547695
    spidercreations

    http://gillianlarson.com/

    I’ve added the image to the right in the header. Added this to the functions.php file (child):

    function after_head_image_func(){
	echo "<div class='custom_content'><a href='http://realityrally.com' target='_blank'><img src='http://dev.gillianlarson.com/wp-content/uploads/2015/11/reality-rally-logo.png'></div>";	
}

add_action('ava_main_header', 'after_head_image_func');

    Then added this to Custom CSS:

    .custom_content{
position: absolute;
top: 0;
right: 0;
z-index: 999; 
}

    Is there a way to hide that image once the screen size has a width less than 670 or so pixels?

    Steve

    December 7, 2015 at 7:15 am #547788
    Rikard

    Hi spidercreations,

    Please try the following in Quick CSS under Enfold–>General Styling, it will target mobile screen sizes:

    @media only screen and (max-width: 767px) {
.custom_content {
display:none !important;
}
}

    Best regards,
    Rikard

    December 7, 2015 at 4:18 pm #548060
    spidercreations

    Thank you!

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Hide Additional Image in Header for Mobile Devices’ is closed to new replies.