Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Perhaps you’re not using the correct image path?
Are you using Google Chrome?
no locsalhost – IE7, got the box to show now as white, just have to figure out how to export a transulant image now.
But it looks like your original answer was correct.”Use a background image that has translucency instead.” which is what I was trying avoind and see if I could learn some new tricky code.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Is this what you want to achieve http://cssdesk.com/wuUSc ?
YES YES YES – whew, feel exusted now after that learning session.
How did you get the transulent background.
I have created a 50 transulant white block and exported as png in 8bit pallete.
then saved with transparent background – but I keep getting a white block and not translucent.
I feel you are my savier if you can explain this to me..
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
I have created a 50 transulant white block and exported as png in 8bit pallete.
then saved with transparent background – but I keep getting a white block and not translucent.
Sorry, I don’t understand why you created 50 images.
50% transparent white box – how did you do the black transparent in the link yous sent me – the one you edited of mine????
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
I uploaded a 1px by 1px white image at 50% opacity here
http://img689.imageshack.us/img689/3913/testtransparency.png
Use that.
thanks man-finally figured it it out.
convert image into bitmat first then export as png with transparent background.
Thanks Andrew for stiking with me on this one.
Surely there must still be an easier way in code.
What about that suggestion of using the top: tag in css?
Do you know anything about that???
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
What about that suggestion of using the top: tag in css?
Can you sum up that question again? I can’t find it.
no problem: I did find in another forumn…that if one uses the top:4.7em it should sit ontop of the opaque block.
this being applied to the <h> tag.
did not try it.
Anyway – thanks again. petty we went round in acomplete circle on this one.
Until the next problem.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
That sounds like someone is describing an alternative to using the translucent image. There is an alternative.
The alternative is to move your <h3> element outside of your <div> that has your background image and then use absolute positioning to force the <h3> on top of the <div>.
See this CSSdesk page for example http://cssdesk.com/zeNyr
In that CSSdesk page, there is opacity applied to the <div> but the <h3> is not affected. The drawback to this is that it produces junk HTML and therefore may be disadvantaged to SEO.
Thanks buddy 0 appeciate again all your time spend on this rather trivia thing. Hope others can learn from it as I have.
Have a great eveing – wherever you are.
