Adding Image to Static Page Header in DailyMag

  • Unknown's avatar
    missionmidwest · Member ·

    Hello, I’m trying to use CSS to add an image from my media library to the header (entry title?) of each of my static pages. For a handful of my pages I’ve been successful using the following code which I found through a search of this CSS Customization forum:

    @media screen and (min-width: 800px) {
    .page-id-140 .entry-title {
    background: url(‘https://i1.wp.com/missionmidwest.files.wordpress.com/2017/09/bulletin.jpg’) no-repeat scroll left top / 15% transparent;
    padding-left: 100px;
    height: 130px;
    padding-top: 30px;
    }
    }

    @media screen and (max-width: 799px) {
    .page-id-140 .entry-title {
    padding-left: 90px;
    padding-top: 0;
    }
    }

    However, the image disappears when resizing my browser window and does not appear at all when accessing my site with a tablet or smartphone. Is there another way to drop an image into the header, perhaps one in which the image will resize in tandem with other elements on the page?

    Many thanks in advance for the help!

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    shubhamgmath · Member ·

    Hi missionmidwest
    The image disappears when resizing my browser window and does not appear at all when accessing my site with a tablet or smartphone because while applying css for the max width 799 you are just giving padding you need to add the background image their also. 

    @media screen and (max-width: 799px) {
.page-id-140 .entry-title {
background: url('https://i1.wp.com/missionmidwest.files.wordpress.com/2017/09/bulletin.jpg') no-repeat scroll left top / 15% transparent;
padding-left: 90px;
padding-top: 0;
}
}

    you can try with this code. I hope this will solve your issue.

  • The topic ‘Adding Image to Static Page Header in DailyMag’ is closed to new replies.