Noob Need some css help with coraline theme…

simplyguidelines · Member · Jan 19, 2011 at 7:23 pm
Copy link

Add topic to favorites
Hello…

I’m a noob at css but been in design for years – this doesn’t help! So I’ve been trying to figure out how to manipulate css by myself. Unfortunately I’ve run into a few problems…

This is the site I’ve been experimenting with http://simplyguidelines.wordpress.com/

I’m trying to change the colour and look of the menu tabs but I can’t seem to get at them

I’m struggling with the fonts – I really want a sans serif for the body text – I even tried typekit but no help

And as an aside when I check the site on the ipad I lose the left and the right hand side – (this may be a size and mobile site issue)

Anyway, I hope someone can help out – thanks in advance

Rick

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Jan 19, 2011 at 8:42 pm
Copy link
For the colors of the tabs, the following is where they are located. There are several that you will have to change as you can see. I’ve just included the declarations associated with the font color and the background colors for the tabs (at rest and hover). The first is the inactive page tab font color. I have red for the colors of the backgrounds just for clarity.
```
#access a {
color: #000000;
}

#access .current_page_item a {
background: none repeat scroll 0 0 red;
color: #FFFFFF;
}

#access ul ul a {
background: none repeat scroll 0 0 red;
color: #EEEEEE;
}

#access li:hover > a, #access ul ul *:hover > a {
background: none repeat scroll 0 0 red;
color: #FFFFFF;
}

#access ul ul a:hover {
background: none repeat scroll 0 0 red;
}
```
On the fonts, the main font setting is here (I’ve added the standard san-serif fonts that will work for every computer). If you want to use typekit for the font, then this is the selector you will need to give them for all the body text (and the text in the sidebar):
” body, input, textarea “
```
body, input, textarea {
font: 14px/1.7 Helvetica,Arial,san-serif;
}
```
On the mobile issue on the iPad, go to appearance > extras and make sure you have the mobile theme activated.
thesacredpath · Member · Jan 19, 2011 at 8:45 pm
Copy link
One other note. With the type of background image you are using, you need to have “background-attachement” set to scroll otherwise the header and content scroll over it and look strange.
simplyguidelines · Member · Jan 19, 2011 at 10:35 pm
Copy link
Thanks for your help… As for the background, I have no idea what I’m doing! :-)

I am slowly working my way through all this so I havent manged to sort everything out yet! Although I am starting to get it straight in my head I imagine it will take time to become used to working with this curious code :-)

Thanks again

Rick
thesacredpath · Member · Jan 19, 2011 at 11:37 pm
Copy link
For right now on the background, set the background-attachment to “scroll” as below and that will fix it.
```
body {
background-attachment: scroll;
}
```
simplyguidelines · Member · Jan 19, 2011 at 11:57 pm
Copy link
I will get on with this tomorrow morning – thank you
simplyguidelines · Member · Jan 20, 2011 at 10:04 am
Copy link
thesacredpath – you sir, have a brain the size of a planet!!

thanks so much

No items found.