WordPress.org

Ready to get started?Download WordPress

Forums

colors (11 posts)

  1. apestaartje
    Member
    Posted 3 months ago #

    Hi, I want to change the background color of my website with CSS.
    However when I change this the space BESIDES the website changes while the background of the site ITSELF changes in the color I don't want.
    May be it's possible to change the whole background including the menu, widgets and footer areas?

  2. mlddev
    Member
    Posted 3 months ago #

    Please provide a link to your website so that I can take a look at the CSS with Firebug and I will try to help.

  3. apestaartje
    Member
    Posted 3 months ago #


    indebioscoop.com

  4. mlddev
    Member
    Posted 3 months ago #

    The reason your are seeing what you described is due to the content area having a semi-transparent image overlaying the background color on your body tag.

    Here is the CSS code that is affecting your content area:

    .art-sheet-body:before {
      background-image: url("images/sheet.png");
      bottom: 0;
      top: 0;
    }

    You could comment out the background on that style to remove the overlay or set the background-image property to none:

    .art-sheet-body:before {
      /* background-image: url("images/sheet.png"); -- commented out */
      background-image: none;
      bottom: 0;
      top: 0;
    }

    It would be best for you to establish a child theme if you are not already so that changes you make will not be lost if you update the theme in the future.

  5. mlddev
    Member
    Posted 3 months ago #

    In addition you can add color back to the content area by just adding a background color to the same css as posted above:

    .art-sheet-body:before {
      background: none repeat scroll 0 0 #555;
      bottom: 0;
      top: 0;
    }
  6. apestaartje
    Member
    Posted 3 months ago #

    OK, thanks.
    I will try.
    Does this new CSS include the background of the menu, widgets en footer area?

  7. mlddev
    Member
    Posted 3 months ago #

    The CSS I provided is already in your style.css file (line 812)... I just pinpointed it for you so that you can modify the background for the content area. This does not affect the header, menu or footer area.

  8. apestaartje
    Member
    Posted 3 months ago #

    Ok...the point is I do want to change the background of the other mentioned areas as well.

  9. mlddev
    Member
    Posted 3 months ago #

    Outside of your header image and footer image the only color being applied is through the color set on your body tag.

    Line 222 in your style.css file:

    body {
      background-color: #262626;
      color: #C2C2C2;
      margin: 0;
      min-width: 1000px;
      padding: 0;
    }

    If you remove the image layover with the following, then you will be able to set the background color on your body above.

    .art-sheet-body:before {
      /* background-image: url("images/sheet.png"); -- commented out */
      background-image: none;
    }
  10. apestaartje
    Member
    Posted 3 months ago #

    Great, thanks a lot!
    This brings me to another relevant question:
    Is it possible to change a font color on all the pages with just one adjustment? - not meaning H-fonts.

  11. apestaartje
    Member
    Posted 3 months ago #

    By the way Middev, I am able to change the background of the backsite, but how can I change the background of the space BESIDES the website - now the overlay has gone?

Reply

You must log in to post.

About this Topic

Tags