color changes do not change footer, just header

Hi -
When I change the color scheme in Theme options, (I want to change it to the dark theme), it only change the top portion of the page, the footer doesn't change with the color scheme. Is there a way to fix this so that the navigation background css matches the footer when I change the color scheme in this theme?


  • DavidM
    • DEV MAN’s Mascot

    Hi stopha,

    The available Preset Styles don't actually make any changes to the footer, which incidentally uses gradients rather than graphic images for the background.

    However, you can override the styles with css by adding something like the following to the very bottom of your stylesheet at Appearance > Editor.

    #footer {
    background: rgb(79,79,79); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(79,79,79,1) 0%, rgba(14,14,14,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(79,79,79,1)), color-stop(100%,rgba(14,14,14,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(79,79,79,1) 0%,rgba(14,14,14,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(79,79,79,1) 0%,rgba(14,14,14,1) 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, rgba(79,79,79,1) 0%,rgba(14,14,14,1) 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f4f4f', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, rgba(79,79,79,1) 0%,rgba(14,14,14,1) 100%); /* W3C */

    I get css gradient code like the above from the following, an incredibly useful resource:

    Hope that helps!


Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.