WordPress.org

Ready to get started?Download WordPress

Forums

How do i make the body transparent? (9 posts)

  1. VBPartners
    Member
    Posted 4 years ago #

    I want to make the body (where the text goes) transparent so that it shows the image below. http://www.themexicanconflict.com/

    I'm pretty sure that i have to change it here:
    style.css

    #content {
    background-color:#e4edc3;
    background: url(images/vertical-line.jpg) top right repeat-y;
    line-height: 1.4em;
    }

    However, not sure what i need to set the background to in order to make it transparent.

    Any help would be greatly appreciated!

  2. Mark / t31os
    Moderator
    Posted 4 years ago #

    background-color: transparent;

    http://www.w3schools.com/css/css_background.asp

  3. VBPartners
    Member
    Posted 4 years ago #

    Hi, I tried that but it didn't work. Could it be something/some place else?

    Thanks

  4. juozas
    Member
    Posted 4 years ago #

    I recommend using firefox extension firebug, with it you can test different approaches for problem. You have to set "background:transparent" for #page firstly. But this isn't user friendly solution, because background image impairs text visibility.

  5. royho
    Member
    Posted 4 years ago #

    Firstly I think you mean semi-transparent right? If it's transparent, there is no color at all, the text is basically sitting on top of that image. but if you do that, you won't be able to read the text comfortably.

    So the only other suggestion for you is to make it maybe 80% opaque. That way you can see through to the image but still have legible text. You can do this easily with 1px by 1px semi-transparent color box of your choice...

  6. VBPartners
    Member
    Posted 4 years ago #

    great thanks! that's what i was missing.

  7. Mark / t31os
    Moderator
    Posted 4 years ago #

    Hi, I tried that but it didn't work. Could it be something/some place else?

    If another style definition is over-riding it, you can force the style using !important..

    background-color: transparent!important;

    ...

    Firstly I think you mean semi-transparent right? If it's transparent, there is no color at all,

    Transparency applies to the background, not the whole element... text color for example does not automatically inherit transparenecy from the containing elements background.. (background is seperate to text color - i'm sure you actually know this anyway).

    So no, it wouldn't leave text unreadable, unless it blended with the background, making it harder to see.

  8. royho
    Member
    Posted 4 years ago #

    I am not sure what you are referring to, but I did not say the text will be transparent as well, I am saying if the background image shows through with the text on top of it, it would be hard to read...

  9. Mark / t31os
    Moderator
    Posted 4 years ago #

    If it's transparent, there is no color at all

    It's the way you said it, to me it sounded like you were refering to the text, since color in CSS terms refers to the text color..

    No harm done .. just a small misunderstanding .. ;)

Topic Closed

This topic has been closed to new replies.

About this Topic