WordPress.org

Ready to get started?Download WordPress

Forums

header background colour change (3 posts)

  1. karlc
    Member
    Posted 1 year ago #

    Hi, having trouble locating header backgroundcolour change,want to go from whit to black. Can only find this:

    /*** Header ***/

    .header {height: 158px; overflow: hidden; padding-right: 30px;}

    .logo {width: 900px; height: 128px; padding: 18px 0 12px 30px; overflow: hidden; float: left;}
    .logo img {max-height: 128px; max-width: 290px;}

    .site-description {width: 290px; height: 111px; padding: 35px 30px 0; float: left; overflow: hidden;}
    .site-description .textwidget {font-size: 11px; color: #656363; line-height: 1.3;}

    .menu {width: 100px; padding-right: 30px; float: right;}
    .menu ul {margin-top: 35px;}
    .menu li {font-size: 11px; text-transform: uppercase; margin: 6px 0;}
    .menu a {color: #fffff; text-decoration: none;}
    .menu a:hover {text-decoration: underline;}

    .search {width: 145px; margin-top: 28px; float: right;}
    .search fieldset {width: 145px; height: 31px; background: #dadada;}
    .search input {width: 105px; border: none; background: none; padding: 8px; color: #fff; font: 11px Georgia, Geneva, "Times New Roman", times; text-transform: uppercase; vertical-align: middle;}
    .search button {width: 16px; height: 16px; background: url("images/search.png") 50% 50% no-repeat; cursor: pointer; border: none; vertical-align: middle;}

    /*** Navigation ***/

    http://nativemusicrecordings.com/

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    Try using a browser developer tool for this kind of exploratory CSS work.
    I used Google Chrome's built-in Developer Tool just because I find it particularly easy to expose underlying HTML and CSS as compared to Firebug.

    Now that you know the style, from being exposed/added by the Developer Tool, you can add a new style to override it.

    You ought to add new styles externally, not within the theme's files. Changes to the theme's files will compromise the theme and be compromised when the theme updates.

    External changes can be made using a Child Theme or through a plugin that provides Custom CSS functionality.

    I recommend using the Jetpack plugin and its Custom CSS functionality to hold your CSS modifications.

  3. karlc
    Member
    Posted 1 year ago #

    Sound advice thankyou......

Topic Closed

This topic has been closed to new replies.

About this Topic