Double Bulleted list in Firefox, no image padding

fobweb · Member · Dec 26, 2008 at 6:39 pm
Copy link

Add topic to favorites
I’ve managed to convert my regular custom WordPress theme to a sandbox theme, but there are two niggly things that I just can’t get rid of:

No matter how much padding I stick in, the text bumps right up against my post images.

In Firefox, I end up with two bullets in my sidebar list.

If anyone can help, that would be awesome. I’ve worked really hard to design this theme:

Home
aw1923 · Member · Dec 26, 2008 at 7:02 pm
Copy link
replace this

div.sidebar ul li a {
background:inherit;
color:#785000;
}

with this

div.sidebar ul li a {
color:#785000; background: none;
}
fobweb · Member · Dec 26, 2008 at 7:10 pm
Copy link
You’re awesome.

That’s been bothering me for hours. I did much customization obviously, so it was like finding a needle in a haystack.
aw1923 · Member · Dec 26, 2008 at 7:24 pm
Copy link
Your welcome, I can’t figure out how to solve your padding issue. Since I have nothing else to do I’ll keep trying but I’m sure devblog will show up sooner or later to solve the padding issue.
1tess · Moderator Emeritus · Dec 26, 2008 at 7:33 pm
Copy link
Maybe you also noticed the space between the lines (leading) make it difficult to read. In Safari, anyway the tops of tall letters is almost touching the bottoms of the letters on the line above. I know nothing about CSS but I think that is connected, right?
aw1923 · Member · Dec 26, 2008 at 7:40 pm
Copy link
add this. Its the CSS code I used on my blog, except for you I changed the padding to 10px so you can see the difference. Obviously you might want to delete the border styling, but you might like having a cute dotted border around the images :)

.entry-content p img {
border-top:1px dotted #CCCCCA;
border-bottom:1px dotted #CCCCCA;
max-width:100%;
padding:10px;
}
fobweb · Member · Dec 26, 2008 at 8:59 pm
Copy link
Cool, that did the trick.

Now, my mac is out of commission at the moment, so what’s it doing in Safari?
fobweb · Member · Dec 26, 2008 at 9:00 pm
Copy link
And yes, I’m going to optimize the header and background images :)
aw1923 · Member · Dec 26, 2008 at 9:07 pm
Copy link
you can go here and get screenshots of your blog to see what it looks like in different broswers.

http://browsershots.org/
vivianpaige · Member · Dec 27, 2008 at 1:22 am
Copy link
Looking good! But a couple of things I see:
1. The theme is too wide. I’m on a widescreen monitor and I have to scroll sideways. (I think you have it 1100 pixels wide)
2. You should center the blog on the page.
3. There is no text on the footer in IE7.

Also – your email link is screwed up but unless you mask it somehow, you’re going to get a lot of spam.
fobweb · Member · Dec 27, 2008 at 3:59 pm
Copy link
I tried to center it but when I did, the blog title ended up moving around.

And I know it is wide – but the client wanted a lot of space for content. I can smoosh the sidebar down some though, like make it 200px, and remove some of the padding between.

As far as the footer text, yeah, I’m just gonna change it to a static navbar image, because the footer:after doesn’t work in IE, and I can’t figure out how else to do it in WordPress.
vivianpaige · Member · Dec 27, 2008 at 4:15 pm
Copy link
Hmm – the centering should work OK but then I use the older version of Sandbox. Have you tried this?
```
div#wrapper {
margin:0 auto;
padding:0;
}
```
As for the width – I’ve got 2 sidebars and reduced mine to 950 px wide and it doesn’t scroll, so yes, make those adjustments. If readibility is the issue, then you should consider a change to the text in the content. It looks squished. Maybe adjust the line height?

IE doesn’t handle pseudo elements, which is what the “after” thing is.

Another difference I noticed between FF & IE: the pages are indented on FF but not on IE. Not sure what is causing that.

No items found.