h2.postitle a on mobile is illegible

  • Resolved missjanice

    (@missjanice)


    7 years, 11 months ago

    On the home page on mobile/smaller sized screens, the post thumbnails’ titles appear as white with no background which makes them illegible. I’d like to add a background to the h2 or the a, I’ve tried a variety of stuff in Custom Code including these:

    @media only screen and (max-width: 960px) {
    h2.postitle { background: rgba(0, 0, 0, 0.3) !important; }
    }

    @media only screen and (max-width: 960px) {
    h2.postitle a { background: rgba(0, 0, 0, 0.3) !important; }
    }

    Neither has any effect. Any help would be much appreciated.

    Note, I’ve change a few other things in Customize > Misc > Custom Code, no problem. Not sure why I can’t get this one to budge.

    Thank you!

    https://www.jeolmedia.com/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Theme Author OptimizerWP

    (@layerthemes)

    looks like a bug. Can you please try adding this to your Custom CSS:

    @media screen and (max-width: 960px){
.home .img_hover {background: #b4bf46!important;opacity: 0.7;}
}

    Thanks

    Thread Starter missjanice

    (@missjanice)

    Thank you OptimizerWP! I figured out I had an error elsewhere in my css that was making my customization not work. It works now with the following:

    @media only screen and (max-width: 960px) {
    h2.postitle { background: rgba(0, 0, 0, 0.8) !important; margin: 0 auto 0 auto !important; width: 80% !important; }
    }

    Possibly a fix would be good to automatically have a background color in mobile screen sizes as the text automatically displays without hover as (default) white and the text is illegible.

    Nice theme, thank you!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘h2.postitle a on mobile is illegible’ is closed to new replies.

Tags