WordPress.org

Ready to get started?Download WordPress

Forums

Twenty Eleven
[resolved] [Theme: TwentyEleven] Transparent background header (11 posts)

  1. ryan_tnt
    Member
    Posted 2 years ago #

    Hi, I have a Child theme of Twenty Eleven.

    I want to make the background color of my header transparent but keep the background color of the content. And I want to change the background opacity of the content.

    Can someone help me with this?
    thnx

    http://wordpress.org/extend/themes/twentyeleven/

  2. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    Site url?

  3. ryan_tnt
    Member
    Posted 2 years ago #

    I dont have a site URL but here is a screenshot
    WordPress

    and Im trying to make it like this example

  4. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    Unless we can see the live site, we can't offer much help. I can only suggest that you try using Firefox with the Firebug add-on for this kind of work.

  5. ryan_tnt
    Member
    Posted 2 years ago #

    okay I got it live now, hopefully u can help me now lol

    wordpress site

  6. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    #page {background:transparent;}
    #main, #primary { background:#000;}
    #access {margin-bottom:0;}
  7. ryan_tnt
    Member
    Posted 2 years ago #

    thnx but It doesnt seem to work..

    @import url('../twentyeleven/style.css');
    /*
    Theme Name: Child Of TwentyEleven
    Theme URI: http://wordpress.org/
    Author: RL
    Description:
    Template: twentyeleven 
    
    */
    
    #page {background:transparent;}
    #main, #primary { background:transparent;}
    #access {margin-bottom:0;}

    you still can see the dark background behind the header image.
    site

  8. ryan_tnt
    Member
    Posted 2 years ago #

    It works but only if I choose for the light color scheme in the Theme Options.

    Is there a way to make it work with the dark color scheme?
    Twenty Eleven Site

    thank you.

  9. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    Didn't notice the footer. You just have to add:

    #site-generator {
        background: #000;
        border-top-color:#000DD;
        color: #ddd;
    }
  10. ryan_tnt
    Member
    Posted 2 years ago #

    Thnx, I ended up copying the whole dark.css to my Child theme so every light object changes to dark.

    First I just modified the dark.css but I know thats not the proper way of doing it.

    But there is now a border on top of the image header, how can I get rid of this?

    Site

  11. ryan_tnt
    Member
    Posted 2 years ago #

    never mind I found it.

    #branding {
    	border-top: 0px solid #0a0a0a;
    }

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic