Sorting out the left sidebars
As you may have noticed, the content of the left sidebar has been displayed above the header for the last few posts.
That’s basically down to an attempt at laziness which didn’t work. I thought that I’d get away with adding the styling for the left sidebars in header.php but that left me with a copy of the sidebar above the header so I ended up having to put the optional styling in sidebarLeft1.php, sidebarLeft2.php and sidebarLeft3.php. At the moment there’s no need to add similar coding into the right-hand sidebars as they don’t affect the layout of the screen whether or not they have content.
The code required is really simple and basically amounts to setting margin-left to either 2% or 0 and the width to either 10% or 0 depending on whether or not the relevant sidebar has any content.
That’s the sidebars pretty much fully sorted out now although I might return to them later and make that 10% width a calculated one so that the body of the text plus all enabled sidebars add up to 100% of the screen.
Copyright © 2008 by SevaTeem Ltd. All rights reserved.
May 21st, 2008 at 5:02 pm
How do you change the text color in the Kubrick sidebar?
Thanks
May 21st, 2008 at 7:38 pm
You edit the style.css file and change it in two places as follows:
#sidebar h2 {
font-family: ‘Lucida Grande’, Verdana, Sans-Serif;
font-size: 1.2em;
color:yellow; /* or whatever */
}
ie add the line with “color”.
Then after the final “}” following “a, h2 a:hover, h3 a:hover {” you add:
#sidebar a {
color: yellow; /* or whatever */
}
If you’re using a modified Kubrick with more than one sidebar, you may need to replicate those changes for the other sidebars.
May 21st, 2008 at 11:17 pm
Thanks, Arnold -
When I modified the #sidebar h2 it only changed the sidebar headings. I was perhaps not clear but I want to change the color of the lists. I have tried every OL an UL I can find but to no avail!
I am not using a modified Kubrick theme.
May 22nd, 2008 at 12:26 pm
You need to add that second bit of code….
Search for “a, h2 a: hover, h3 a: hover {”
Then after the final “}” of that section you need to add a new section:
#sidebar a {
color:yellow;
}
or, whatever colour you want to use.