CSS help in Child Theme

  • Resolved karikirch

    (@karikirch)


    12 years, 6 months ago

    Hi
    Have realised that a theme I purchased is probably going to go through quite a few updates and have read that it would be best to create a child theme so that changes don’t get overridden with the updates.
    I’ve created a style.css file in the child theme folder and understand about changing basic body and fonts.
    However I am having a problem trying to change the background for a top menu bar.
    This is the code from parent theme:

    #header .top-bar-bg
{
	width:100%;
	overflow:hidden;
	margin:auto;
	background:#444; /*NEED TO CHANGE THIS BACKGROUND COLOR*/
	border-bottom:1px solid #393939;
	margin-bottom:5px;
}

    Any help with this would then help me with other CSS that needs modified.
    Many Thanks

Viewing 5 replies - 1 through 5 (of 5 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    What do you want to change the background to?

    Thread Starter karikirch

    (@karikirch)

    Just another color #0584C1.
    What I’ve been reading is that you don’t have to include everything but just what is required. For instance in the body tag from parent theme:

    body
{
	font-size:12px;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	margin:0px;
	padding:0px;
	background:#f2f2f2
}

    In Child Theme all I put into the style.css file was:
    body {background:#ffffff;}
    and this worked.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    background is short-hand for combinations of these properties;
    background-color
    background-image
    background-repeat
    background-attachment
    background-position

    If you want specifically a background colour, use background-color.
    https://www.w3schools.com/css/css_background.asp

    What I’ve been reading is that you don’t have to include everything but just what is required.

    this basically answers your own question.

    have you tried to add this to style.css in ths child theme:

    #header .top-bar-bg
{
	background: #0584C1; /*CHANGEd THIS BACKGROUND COLOR*/
}

    and remember to clear the browser cache (‘CTRL F5’ oder whatever is needed…)

    if you have further problems, please post a link to your site;
    and also contact the seller of your commercial theme, as support should be included in the purchase price.

    Thread Starter karikirch

    (@karikirch)

    Well that worked, which is what I tried earlier, hence posting this message. Must have been a cache thing – cleared history.
    Thanks guys, appreciate the speedy input.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘CSS help in Child Theme’ is closed to new replies.