WordPress.org

Ready to get started?Download WordPress

Forums

Spun
[resolved] body and background image opacity (7 posts)

  1. Bastienne
    Member
    Posted 1 year ago #

    Trying to tweak your great theme...

    I want a background image that is visible through an opaque (white) textblock

    If I set the body opacity to lets say 0.5 like so:

    body { background: #fff;
    opacity: 0.5; }

    This does what I want with the opacity of the text block but it also fades the text (header and navigation) and images on the blog page.
    If I set this value to 1 it gives me a white block with clear images and text, but no visible background image through this block. A value of 0 obviously hides all menu text and blog images.
    It looks like the body lies on top of the text and images.

    What should I do? Can I change the stacking order of the body so that it is under the images and on top of the background image?

    cheers, Bastienne

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    Use a background image that has the opacity you want.

  3. Bastienne
    Member
    Posted 1 year ago #

    That does not solve my problem unfortunately.
    The background image is opaque and fine where it is.

    Now I set the body opacity:
    1. value of 1 gives me a white textblock over the background image, not what i wnat
    2. value of 0 gives me only the background image with the text and blog images (the circles) covered, obviously also not what I want
    3. value of 0.5 gives me an opaque textblock, but with also the images and text opaque.

    What I want is the third option, but then without fading the text and circled images.

    hope you can help

  4. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    #3 is not possible - that's the way CSS opacity works - elements inside inherit the opacity setting. You'll need to use Andrew's advice above if you want to do that.

  5. Bastienne
    Member
    Posted 1 year ago #

    aha, that clears things up...pity
    I'll have to figure a way around it then.

    I do not see how using an opaque background image would help me here, or do you mean a background image in this particular element (as opposed to the background image of the whole website, as declared in the WordPress admin panel)?

    Thanks all for your quick replies!

  6. Andrew
    Forum Moderator
    Posted 1 year ago #

  7. Bastienne
    Member
    Posted 1 year ago #

    yes!
    got it now, thanks!

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic