#left ul li {
color: #B5D9DE;
margin: 0 0 2em 0;
padding: 0;
text-transform: uppercase;
font-size: 1.1em;
font-weight: bold;
letter-spacing: 0.2em;
Not exactly sure what you are asking, but I did find this in your CSS, notice the text transform: uppercase
The stuff in your “podcast” and “details” lists need to be marked up as list items within the unordered list – i.e.:
[li id="podcast"]
[ul]
[li]Audio Bits[/li]
[/ul]
[/li]
Dunno how you’ve set up your CSS but it looks like an inheritance problem.
On perusal of your CSS: Yup. You undo the text transform for #left ul ul li; without the extra list item tags, the things in all caps are governed by #left ul ul.
Aha – well that might work. Will try. This is a modified template, so I’m sure I messed something up.
Thanks.
Okay – got that sorted, but next question: how do I get the text from bleeding across the border?
Increase the right padding of your sidebar, or of your lists and list items.
I would also recommend shrinking the font a little, or widening the sidebar so you can fit more characters per line in your description – but that’s purely a matter of personal preference 🙂
Okay, last question regarding fonts (fingers crossed). It looks okay on Safari, but the font is aligning with the right side of the image on Firefox. I don’t want text wrap, so how do I get the font to align left, offset from the image?
Instead of having 2 unordered lists within your “details” section, try just having one, with list items for both the image and the text. If that doesn’t work, style the image with clear: right.
Okay, this is what I’ve got:
<li id=”Details”><?php _e(‘Details:’); ?>
It seems alright on Safari, but why not on Firefox?