Mobile version colour block problem
- The topic ‘Mobile version colour block problem’ is closed to new replies.
Need help? Check out our Support site, then
Hi,
My website has the grey box pop up covering all of the blog posts on mobile and it looks awful!
Could you please let me know how to remove the effect?
The site I need help with is http://www.curiousjeorge.com
Thanks,
G
The blog I need help with is: (visible only to logged in users)
Hi there
The overlay displays so that you can see the post title. On desktop it is hidden until you put the mouse over the posts, but hovering like this isn’t possible on a touch device so it’s shown by default.
We can tweak the display with some custom css but that requires a paid plan:
https://en.support.wordpress.com/custom-css/
If you have a paid plan, and want some css, then let me know what you want to do. A few options include hiding the overlay entirely. Changing the overlay colour. Changing the overlay transparency.
Hi,
Thanks for getting back to me so quickly, much appreciated!
I have a paid plan so I should be able to apply the CSS and I would like my site to replicate how the one below works with your theme;
On mobile, it works nicely while still looking good on desktop.
Thanks again,
George
No problem. To do this you need the following css:
.main .post-archive article h2.entry-title a,
.main .post-archive article .post-meta-data a,
.main .post-archive article .post-meta-data {
color: #fff;
}
.main .post-archive article.post-has-thumbnail .entry {
background-color: rgba(0,0,0,0.2);
}
Great, that has worked a treat.
Thanks a lot!