Theme Freak: CSS styling help

  • abreed05

    (@abreed05)


    10 years, 1 month ago

    Hello,

    I am currently trying to figure out what CSS I would need to adjust in this page http://mywoodlandgear.com/happyharvestproject/ to make the white content box transparent and the dark grey footer as well.

    I have looked through the CSS file but am not having any luck. Any help would be most appreciated.

    Thank you,

    Aaron Breeden

Viewing 4 replies - 1 through 4 (of 4 total)
  • paulwpxp

    (@paulwp)

    10 years, 1 month ago

    For accessibility reason there must be enough color contrast otherwise the content won’t be readable. So instead of making it completely transparent, we should use white with some opacity and make sure font color has high contrast to the background.

    Try this code in Custom CSS plugin (or in theme’s setting if provided).

    body .mega-container { background-color: rgba(255, 255, 255, 0.9); }
body #primary-mono .entry-content { color: #000; }

    Some useful info on color contrast

    https://www.viget.com/articles/color-contrast
    http://webaim.org/resources/contrastchecker

    Thread Starter abreed05

    (@abreed05)

    10 years, 1 month ago

    Thank you for replying that did work for me. Can you also help with making the bottom bars transparent as well?

    paulwpxp

    (@paulwp)

    10 years, 1 month ago

    Yes sure

    body #footer-sidebar { background-color: rgba(255, 255, 255, 0.9); }

body #colophon { background-color: rgba(255, 255, 255, 0.9); }
    Thread Starter abreed05

    (@abreed05)

    10 years, 1 month ago

    awesome thank you!

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Theme Freak: CSS styling help’ is closed to new replies.