Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • March 25, 2017 at 10:17 pm #112873
    Mat
    Participant

    Hi,

    In desktop view, there is a semi-transparent box around the title, for instance in the top slider at http://theholyfish.com/ . Another style is like under the ‘photo essays’ portfolio on the home page, where the whole image is covered on mouse-over.

    How can I make either of these styles appear on mobile and tablet view? If you look at the ‘photo essays’ section on a mobile, some of the first article’s title becomes obscured by the bright patch in the featured image. I’m thinking that one way to avoid this would be to have the semi-transparent box appear around the title here.

    Thanks,

    Mat.

    March 26, 2017 at 4:08 am #112896
    Mahesh
    Participant

    @banno2000: Go to Dashboard=> Appearance=> Customize=> Additional CSS box and add the following CSS:

    #portfolio .entry-container {
    background: rgba(48, 48, 48, 0.9) none repeat scroll 0 0;
    opacity: 0;
}

#portfolio .hentry:hover .entry-container, #portfolio .hentry:focus .entry-container {
    opacity : 1;
}

    Regards,
    Mahesh

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • The topic ‘Maintaining transparent title box in mobile view’ is closed to new replies.