-
Posts
-
Hello
My client would like to do this, ie, every 2nd background is a different color.
Portfolio mockup
I’m not sure what to do with css – please advise, and note the semi transparency. Thanks!Hi webWahine!
You can alter following code
.grid-entry:nth-child(odd) .grid-content { background: orange; } .grid-entry:nth-child(even) .grid-content { background: red; }Best regards,
YigitOk, that worked well but 2 more parts to this, please –
In the link in the private area, I need to make the background transparent under the title plus that alternating colours need to be 0.7 transparent. Thanks so much!
Sorry, I added in a line of opacity: 0.7; and that worked but what I forgot to mention is they want it to be over the image as opposed to underneath it – I assume it’s some kind of margin css edit?
I got the transparency to work under the title with –
background-color: rgba(29,29,29,0.0);
So all I need is to know is how to place the .grid-content over the image as opposed to underneath, please :)
I got it so we’re good unless I’m missing something?
.main_color .grid-content {
position: absolute;
bottom: -1px;
width: 100%;
}One more comment! Sorry to be a pest :)
This is how the client wants it to look but the excerpt text is also displaying an alpha of 0.8 and they want it to be 100% white. Is there a CSS trick even though the excerpt is within the grid-content?
Hey!
It’s because of the opacity, should be better to use background rgba:
.main_color .grid-content { position: absolute; bottom: -1px; width: 100%; opacity: 1 !important; background: rgba(0,0,0,0.8) !important; }Cheers!
Josue
- You must be logged in to reply to this topic.