Need help? Check out our Support site, then


Header broken - CSS gone

  1. So no headway on making the header image "shorter" - is there a place I can see the CSS for myself (the stylesheet that's currently in place) so I can just try some things to see if I can fix the issue myself?

    The blog I need help with is thepoliticalpaige.wordpress.com.

  2. The itheme2 stylesheet is here
    https://wpcom-themes.svn.automattic.com/itheme2/style.css
    When you alter a theme’s stylesheet, you only need to put in the Editor the modification/additions to the CSS, not the entire thing.

  3. yikes! - I really appreciate your help - but that may be the most convoluted css I've ever seen (I am definitely not an expert - but still...wow)

    you obviously know your stuff -- any chance you know where in there the "header height" is located? literally not seeing it. thanks again for your help.

  4. just a follow up - have been trying all afternoon - there is no "header height" slot to be found - really hoping someone knows!

  5. ??? i've found other sites that suggest alternate codes - but nothing's working. any help?

  6. Looking directly at the style.css file like that is probably not the best way for beginners to view CSS. :)

    Try checking out the built in web inspector tools in your browser. Right-click on an element and then select the "Inspect Element" option. You should see a panel open up with the HTML for what you clicked on highlighted and all of the CSS that applies to it as well. It's a great way to see which CSS rules take precedence too because you can see which rules are crossed out and which ones aren't (the crossed out ones get overridden by stronger CSS rules).

    Also keep in mind that CSS posted on other sites might not work for you because they're using a different theme.

    I see that http://thepoliticalpaige.wordpress.com/ is using the iThemes2 theme, so try adding the following to your Appearance → Custom Design → CSS editor to cut off the header image and make it appear shorter:

    #custom-header-image {
    	display: none;
    }
    #masthead > a {
    	display: block;
    	width: 978px;
    	height: 180px;
    	background: url(http://thepoliticalpaige.files.wordpress.com/2013/02/cropped-2am-52.png) no-repeat;
    }

    Note that this overrides the image that is set on the Appearance → Header page using custom CSS. So if you want to change the header image in the future, you need to remember to update it on the Appearance → Custom Design → CSS page.

Topic Closed

This topic has been closed to new replies.

About this Topic