I did use backticks for my code – you can see them on the post above – but they are not being converted to code blocks. Any suggestions.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Don’t use CSS opacity if you don’t want child elements affected.
Use a background image that has translucency instead.
thanks Andrew – so I have design and import various size blocks for about 30 headings that are transparent and set as background image within the `#widget-title-three h3′ ID.
Please confirm – seems like a very long winded way, but I am not the expert here, just seems like a lot of work.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Can you first link the issue?
I am working off localhost so no link availible. Sorry.
here is the issue reapeated many times on my site.
widget text. html divided it into three divs. the whole box, the title box with an <h>
inside and a text box.
I have placed a opacity: 0.4;
on a background-color: white; over an image
which works great for the white box but the heading text has also been effected.
I have even tried to create index-z
levels but this won’t work with a <h>
tag within a div. Unless I am missing something here.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Can you instead replicate the issue on CSSdesk and share us a link to that?
I did not kow that facility existed.
had a qucik look and not sure what you require. I am working off resonsive them page template and child css for styling.
Copying the html and css relating to this enquiry would not produce anything as it requires alot of other files being taged / linked to it. I think.
Please advise how to go about providing CSSDesk so you can assist further. Many thanks.
OK Andrew – I have shared it – where it went I have no idea but it is out there for you to grab.
If you remove the opacity you will see thatthe title goes back to black.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Along the top bar there’s an option named “SHARE” [screenshot]
Press that and then link us the generated link
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
I can’t see an issue on that CSSdesk page.
The <h3>BUYING & SELLING</h3>
should be solid black but instead it has been opaqued.
Backgrond color is white with 40% opaque applied.
<h> is black – but it is not on the link or on my computer.
Hope you understand now.
I did find that if one uses top:4.7em
it should sit ontop of the opaque block.
Another is using a 1px x 1px transparent.png file and set it as background to <h>
tag.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
I see.
Another is using a 1px x 1px transparent.png file and set it as background to <h> tag.
Did you resolve the issue this way? The idea is to set a translucent image instead of the opacity on the element you want.
having difficultu creating a transulant.png file.
I am using coreldraw and have create a 1 x 1 px squre and applied a 50% transaprent filter on it.
Then exported as png with transparent background.
Imported it into them and nothing shows up.
QUESTION: How can a 1x1px transulent effect the whole div area, surely it would have to be the same size?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
How can a 1x1px transulent effect the whole div area, surely it would have to be the same size?
Fortunately in CSS background images repeat on both the X and Y axis automatically, meaning the 1px by 1px image would fill up the div area automatically, regardless of its size.