Can anyone tell me how to have my images 100% opaque, whilst retaining 90% opacity for the background. I’ve tried everything I can think of. Maybe it’s not possible?
(As an aside … I’ve asked support and am awaiting a reply, but if anyone can tell me how, on the same page, I can prevent the horizontal image from overlapping to the right of the white background area, when the browser window is re-size/narrowed (just before the break point) I’d be very much obliged. The hours just slip away as I blindly fiddle with the myriad settings and so far, no luck.)
Ahmm - I tend to say, you can’t cause the top parent item inherits the opacity property to all child-items (not only the image btw).
One solution would be to create a tiny png with the wanted color/transparency and apply them as tiling background-image to the parent items (such as Header, Body1 …).
Another method goes a bit deeper into css and means, that you have to deal with rgba colors.
You would detect your wanted color in rgb (rather than hex-value) and have then the possibility to add the opacity with the last value).
For example:
background-color: rgba(0, 0, 0, 0.4);
Once you got it, select the item and hit extended, choose the DIV-Style tab and enter (without any quotes) the name background-color and the value rgba(0, 0, 0, 0.4)
Downside of this method:
You can’t see it in the workspace - only in preview mode.
Upside:
You can leave your current layout (hopefully) in order to “simulate” the final result.
I’ve tried the Action, but it doesn’t do anything. (I tried both). Maybe they need to be upgraded to work in FW7? Of course, there’s no documentation so I could be doing it all wrong, but I tried as many variations as I could think of.
I’ll see if I can understand and apply your instructions Thomas.
On the ‘home’ page of my site, there is a layered graphic slideshow using the ‘Target Show/Hide Layer’ action. The background does not show through in this area. The site is based on the Floral template. Is there a trick being done here that I could apply to the images on the ‘prints’ page?
Select DIV #Header, remove all the inspector settings done (opacity and color in the pen tab), apply the action to it and choose in the color picker this light-grey which you applied to the inspector for both. Play with the opacity in the action.
Select DIV #Header, remove all the inspector settings done (opacity and color in the pen tab), apply the action to it and choose in the color picker this light-grey which you applied to the inspector for both. Play with the opacity in the action.
Thomas,
am I supposed to apply the action to the image item or to the header/body part?
I never use those actions as well, I’d stay with the Extended style option
There is one thing that would make me give up using the Extended style
definitions - actually having these as features of the app. Not Actions or
add-ons - proper features. There’s a world of normal CSS that doesn’t exist
in FWP that should.