spacing of lines in sidebar lists is off
-
Below is how the spacing of long entries (such as “Planting an Organic Vegetable Garden) in sidebar lists roughly looks on my site.
GARDENING TIPS
Ideas For Spring
Planting an Organic
Vegetable Garden
Fall Clean Up
Below is how the spacing roughly should look when such a long entry is used.
GARDENING TIPS
Ideas For Spring
Planting an Organic
Vegetable GardenFall Clean Up
I’ve tried but am now clueless how to achieve the spacing in the second example above. How do I change the code below to achieve this? Below is the style.css for the left sidebar.
#l_sidebar {
color : #013172;
font-weight : normal;
float : left;
width : 250px;
margin : 0 0 0 0;
padding : 10px 0 20px 0;
line-height : 22px;
}#l_sidebar h2 {
background : #ffffff url(images/headline_left.gif);
color : #ffffff;
font-size : 11px;
font-family : Arial, Tahoma, Verdana;
font-weight : bold;
text-transform : uppercase;
margin : 10px 0 5px 0;
padding : 3px 0 3px 10px;
}#l_sidebar p {
padding : 0 0 0 0;
margin : 0;
line-height : 20px;
}#l_sidebar p a {
color : #013172;
font-weight : bold;
text-decoration : underline;
}#l_sidebar p a:hover {
color: #2255aa;
font-weight: bold;
text-decoration: underline;
}#l_sidebar ul {
list-style-type : none;
margin : 0 0 10px 0;
padding : 0;
}#l_sidebar ul li {
list-style-type : none;
margin : 0 0 5px 0;
padding : 0;
}#l_sidebar ul ul {
list-style-type : none;
margin : 0;
padding : 0;
}#l_sidebar ul li li {
background : #ffffff;
padding : 0 0 0 15px;
margin : 0;
border-bottom : 1px solid #eeeeee;
}#l_sidebar ul li li a {
color : #013172;
font-weight : normal;
text-decoration : none;
}#l_sidebar ul li li a:hover {
color : #2255aa;
font-weight : normal;
text-decoration : underline;
}#l_sidebar ul li ul li {
background : #ffffff;
padding : 0 0 0 15px;
margin : 0;
}#l_sidebar ul li li a {
color : #013172;
font-weight : normal;
text-decoration : none;
}#l_sidebar ul li li a:hover {
color : #2255aa;
font-weight : normal;
text-decoration : underline;
}I posted this last night. Does anyone know what code I should use to make this?
updating so page is not lost in list.
Do you have a site link for us to have a better look?
Are these post titles/links or page links?
Thanks so much for responding, henkholland. The examples above happen to be lists of pages I put in a sidebar pages widget. However, it could have been any kind of widget, like recent posts, or links.
The URL is https://hotsmoothdudes.com/ To adhere to the guidelines of this forum, please note: This is an adult website, but the adult content has temporarily been removed so that people can perhaps solve this technical problem. When the issue is resolved or when the adult content is put back, I will post a reply not to go to the URL address.
You will see this effect under “Tips and Topics” in the left sidebar, but it probably applies to any list in any sidebar on the site.
refreshing the post so people can see it and hopefully figure it out.
Ok, this looks better:
Find in style.css (regel 556) and change to:#l_sidebar ul li ul li { -moz-background-clip:border; -moz-background-inline-policy:continuous; -moz-background-origin:padding; background:#FFFFFF none repeat scroll 0 0; margin:0; padding:5px 0 5px 15px; /*THIS WAS 0 0 0 15px */ }
Find in style.css (regel 480)
#l_sidebar { color:#013172; font-weight:normal; line-height:18px; /* THIS WAS 22px */ }
Thanks! I am trying this code out right now and will tell you in a while the result.
Henkholland, it worked! In #l_sidebar, I only changed the line-height because I think I needed to have the width of the sidebar in it. I put it to 16 and it still works. I have to see which spacing I like best.
With the #l_sidebar ul li ul li, it worked with the exact code you had, but the W3C CSS Validator gave me errors that the three moz things do not exist or something. So I took them out, still works, and the validator shows no errors.
The most important thing is that you resolved this sticky problem. I am sincerely grateful! Thanks and for taking time to read my inquiry.
PLEASE NOTE: To comply with the guidelines of this forum, the URL given for the site in this post should NOT be visited any more. As the this post is now resolved, the adult content that was removed from the site for the purposes of this discussion have been put back on the site. Please do not visit the URL above. Thanks.
Ok, good for you Ta100. As topic starter you can mark the topic RESOLVED at the right hand side of this screen.
And W3c always gives the moz stuff warnings; I have them and igon ore them.
BTW I could advise you with only the help of Firefox and Firebug. How?
Get Firefox and then the free Firefox addon Firebug. You can then click anywhere in your site and see what piece of the css influences that piece of your site and you can even make changes but not save them, so it is safe to practice.
- The topic ‘spacing of lines in sidebar lists is off’ is closed to new replies.