Jump to content
Sign in to follow this  
ayopa

New to CSS - where to insert changes

Recommended Posts

ayopa

I am a beginner to css, and I am trying to learn how to modify the child theme so i can customize the canvas area. My question is: where do I insert the CSS changes? Do I open the base.css or style.css file (of the child theme), and then where exactly in that file do I start inserting the changes? thanks very much

Share this post


Link to post
Share on other sites
kastelic

The best places are either in the Custom Code -> Custom CSS section of your backend settings (recommended for beginners) , or in base.css. CSS rules "cascade" meaning rules affecting an element override rules that are located above them in the file. So if you want to override a rule, place it at the bottom. If you want to change a rule, just change any rule you want. Putting the code in Custom CSS places it effectively below all the other CSS files, so anything you put here will override.

Share this post


Link to post
Share on other sites
cmodesign

I am trying to change the font style of the headings in the footer. I want to make them smaller, bold, and blue. I have tried editing the theme.css, base.css, and pasting the code directly into Custom Code > CSS Rules. Non of this seems to work. I used FireBug to find the CSS element. This is the code I am trying to use:

#footer .widget-title {
	    border: 0 none;
	    font-size: 0.75em;
	    margin-bottom: 0.6em;
	    padding-left: 0;
	    color: #0CF;
	    font-weight: bold;
	}

I have PlatformPro 1.3.2 uploaded to my theme directory "platformpro" (all lowercase). This theme is NOT activated. I have PlatformBase 1.3.2 uploaded to my theme directory "platformbase" (all lowercase). The Base theme IS activated.

Share this post


Link to post
Share on other sites
Simon

They are a h3, try `#footer .widget-title h3 {}`

Share this post


Link to post
Share on other sites
cmodesign

I tried adding the h3 tag but that didn't make any difference either. I used both the Custom Code > CSS Rules and uploading a revised base.css file.

#footer .widget-title h3 {
	font-size: 0.75em;
	color: #0CF;
	font-weight: bold;
	}

Share this post


Link to post
Share on other sites
catrina

Try this one instead:

#footer h3.widget-title {
	font-size: 0.75em;
	color: #0CF;
	font-weight: bold;}


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×