CSS for beginners?

Hey there,

You can’t edit “classes” or “IDs” that aren’t there in firefox because you can’t add these to your style sheet. I’d suggest opening up your style.css and going to the very bottom and adding in a few empty classes.

In order to make yourself a class you have to put a “.” in front of the chosen name. So for instance if I wanted to make a class with your username I’d make it:

.ribena_wrath { 

}

The . tells the CSS file it’s a class and the text after it (which can be anything you need it to be to an extent) is the class name. And of course as you know inside the brackets is your styling.

?? I hope this helps a bit. If it doesn’t let me know and I can try and help you further.
Thanks
Megan

you want to edit the appearance of text? Or the physical text?

To edit text you may be delving into html, or php.

as far as css….

.class is a class referenced as div class=”something” in html

#id is an id refernced as div id=”something” in html

IDs can only be used once on a page, classes used multiple times

https://www.w3schools.com/css/
Is a great reference for basic css

Hi, Thanks for your great replies you two!

I want to style everything on the page. Mostly text and positioning, plus a few parts to make it look nice.
I’m using wordpress and buddypress for a site, but I need to style parts which seem to have a global styling attached to them. IE, if I edit a content area, it affects all content areas across buddypress.

So I need to add new clases to areas I wish to edit as separate areas.

How do I give an area a class? Say we use

.ribena_wrath { 

}

How do I make it so that the class is attached to the are I want it to be attached too?

Hi, if you can be more specific, a link to a website, you can style a lot of elements with just css using a hierarchy (two or more classes), look at the default twenty eleven theme.

Create a local install so you are not uploading files all the time, import dummy data there a number of sources for this, if you have a website already export the content and import to a local install.

Have a look at twenty elevens style.css and you will see styles like:
Single page:

.singular #content {
.left-sidebar.singular #content {
.page-template-page-category-php {
.singular .entry-header{
.singular .entry-content{

If your theme supports the body class then use FireBug to find the class you want to change, right down to a post or page.

.post-1249 #content {
.page-template-page-category-php #content {

With a local install you can play with the theme and have an easy recovery point.

FireBug has live edit so you can add a new style or change a style, but not save it!

HTH

David