CSS styling the list in the sidebar

Just took a look at your source;

You have

• Links

#sidebar li
{
margin-left: 10px;
}

this should put 10px margin for the whole thing. if you want margin for other ul and li, you can go like this;

#sidebar li ul
#sidebar lu ul li
and etc.

That’s incorrect.

It should be:
#sidebar ul
#sidebar ul li
#sidebar ul ul
#sidebar ul li ul li < for child list elements

And also remember that Opera, FF and IE all put different amounts of left padding into list elements to begin with so you’ll have to play with it and possibly write a conditional stylesheet if you want them exactly alike across all browsers.

https://www.darrenfauth.com/css-sandbox/css-list-cross-browser.php

??

First off, Darren’s site won’t load so I can’t read his article. Secondly, I do want 10px margin-left for the whole unordered list but even adding:

#sidebar ul {
margin-left: 10px;
}

it does nothing. It’s still butt left to the entire sidebar div. That should not be happening at all. However, if I add a width to that element, everything goes crazy. The div drops down underneath the content div on the left and it doesn’t matter how much of a width you give to the div. It also adds a ton of margin (or padding?) to the ul li ul li on the sidebar. Again, that’s only if a width is suggested. Why is that?

Article loads just fine for me. I’ve cut and pasted it below for you.

[EDIT: The code in this article is making the rest of the replies to this thread wonky, so I’ve removed it. /jmm]

OK, I get that but that’s not my problem. My problem is that no matter what margin I give it, it just ignores it and nothing happens unless I add a width and then it goes kerflooey. Thing is I shouldn’t need to add a width at all. Just a margin (or padding).

I’m looking at your stylesheet and I don’t see #sidebar in there at all. I did a “Find” and came up with nothing.

Bear in mind that you have a fixed width wrapper so that limits the area you have to work with. You need to be sure there’s enough “air” between the left #content and right #sidebar. Then within #sidebar you should be able to apply margins and padding that you want, but remember if you add margins and padding there, you’ll need to adjust it downward elsewhere or the sidebar will drop down below the content. Make sense?

No, you should add width and it will need to be a specific width or you’ll get the drop down behavior you are experiencing now. Hey, I’m trying to help you, thought you might want that article, but what the hell do I freaking know, right?

Well, that’s the weird thing. The #sidebar div is in this file called rtl.css which comes along with the style.css and I guess that the page doesn’t see that. Why do we get two .css files with the templates anyway?

rtl.css is only for right-to-left text (such as is common in Muslim or Asian blogs, which generally read from right to left, rather than left to right).

You need to put that code into the style.css file; that’s prolly why nothing’s worked for you.

OK, so that’s what it means! Well, I followed your advice and added it but now it’s collapsing beneath the #content div and so I’m trying everything to make it work. Setting all sorts of margins and padding to zero, Eliminating the headers from each div, changing the width of the sidebar div to next to nothing. Absolutely nothing works.

I’m not at my usual computer and don’t have my FireFox dev. tools handy on this machine. I’ll try to take a look at it when I’m home later. Shouldn’t be too hard of a fix. BTW, and a little OT, I’d love to know when that site goes live; there’s some great info there and I know two people who could benefit from it. ??

Muslim or Asian blogs

you sure about that?? (lol, 2 fer 2)

Cool. I’ll gladly let you know, Joni. This is actually one of the last sticking points. The store (which is using the ZenCart template) is essentially done. And the blog was working until the client decided to bring back the sidebar and then everything got messed up.

@whoo: Maybe that wasn’t the right choice of words, Middle Eastern. Those read right to left; I worked for an Egyptian for a year and it drove me crazy. Drove our copy department nuts too. Asian (Japanese, Chinese, Vietnamese — and I’m sure Korean as well, not sure) also read from right to left.

Why me? WTF have I ever done?

Here:
https://en.wikipedia.org/wiki/Right_to_left#Directionality

P.S. I don’t keep score. And I’m never mean to those I like. Others, however, best watch out.