borders around cats on sidebar

adding something like this:
border:2px dotted #000000;

to the #sidebar ul li area of the style.css for the theme you are using will get you started.

Also the codex is a great read for this type of thing. https://codex.www.ads-software.com/Styling_lists_with_CSS

Best bet would be to enclose each ‘element’ into a div. In this case you would want to create a class, so that you could use it many times on one page. Maybe call it: <div class="sidewrap"></div>

.sidewrap {
border:1px dotted #ccc}

You will probably want to also add padding and/or margin values to get your .sidewrap style more visually satisfying on the page.

Its unnecessary. CSS cat selectors are built in.

I always forget that not everyone has cats turned off like me :} Like Mat says, check the theme you are using.

Theme makes no difference. Just style in the CSS.

Thanks for all of your replys!

As soon as I start editing, and run into problems, I will let you guys know.

Thanks again!

Ok. This is as far I have gotten. I have figured out how all of the ul,ol, and li works with the CSS.

I am so close.

Here is the CSS:

#sidebar ul li {
list-style-type: none;
list-style-image: none;
margin-bottom: 15px;
border:2px dotted #ccc;
}

But it also puts a border around the third tier of ‘li’ and it should not.

I am modifying the default template.

Thanks, th3gh05t

someone please help me..

Hi,

I decided to put each element into divs, but it didn’t turn out I had hoped for, in Internet Explorer. I have only used Firefox other than IE, and wondering if someone can site check this for me.

https://www.pumpupthevalium.com

Here is the CSS I used for the div:


#sidebar .sidewrap {
border: 2px dotted #ccc;
margin-bottom: 10px;
margin-top: 10px;
}

And some HTML output:


<div class="sidewrap">

<li><h2>Theme Switcher</h2>
<ul>
<li class="ts_current_theme"><a href=#=default'>blue</a></li>
<li ><a href='#=green'>green</a></li>
<li ><a href='#=red'>red</a></li>
</ul>
</li>
</div>

<div class="sidewrap">

<li><h2>Author</h2>
<b>derek</b> - This is where you find information about me.

<b>location</b> - los angeles, ca
</li>
</div>