Adding Space Between Lines in a “Recent Posts” widget

This part of your CSS (around line 59) controls the overall spacing between the posts:

div.widget ul li {
  border-left:5px solid #115588;
  display:block;
  margin:5px 0 2px 3px;
  padding:0 0 0 5px;
}

You could look at editing the above (change the third value in the margin line) or adding something like this:

div#recent-posts-3 div.widget ul li {
margin-bottom: 10px;
}

Where did you add that CSS? I don’t see it anywhere. It does look right though.

Looks like your theme injects the CSS directly into the head of the page. That means its going to overwrite anything you might put in a stylesheet– assuming the theme isn’t reading style.css and then injecting it, which may be the case. Try putting your CSS immediately before the </head> in your theme files– usually header.php.

Question 2: Not the way the widget is written right now. Its not providing any way to distinguish between the different li’s. Does this…

On the right sidebar I have a standard text widget for Recent Posts that I took from WordPress default widgets.

… mean that you’ve edited the default widget and created a new one? If so, it isn’t hard to include code that will let you alternate formats.

@apljdi – I was editing with FireBug, missed that it was not pointing directly to the more commonly used style.css

Now to the problem at hand …

This appears to be the Atahualpa theme and from looking at the multitude and myriad options and convolutions (j/k nr) … it appears you can take that little snippet of CSS posted above and …

1. Go to the theme options page
2. Near the bottom click on “Add HTML/CSS inserts”
3. Go to the bottom of that option page for “CSS Inserts”
4. Add: div#recent-posts-3 div.widget ul li {margin-bottom: 10px;}
5. Click on the HUGE Save Changes button

Have at it and good luck, perhaps the author can give an easier method.

@apljdi – I was editing with FireBug, missed that it was not pointing directly to the more commonly used style.css

Actually, I was responding to Lance007. We were posting at the same time. I didn’t see your post until after mine went up. Oh well, its the nature of the beast.

Nice fix though.

We were posting at the same time. I didn’t see your post until after mine went up

@apljdi – LoL, that happens to me a lot, too ??

Just a thought (for the forum devs / mods) … wouldn’t it be nice if you saw a flag or something on the screen if a post was made before you clicked on the final submit button. Then you have a chance to decide how best to continue before actually “posting” your reply. (SMF powered forums offer it, as an example.)

Yeah, a flag would be nice. I’d also like posts in the ‘my profile’ list to be ordered so that recent responses are at the top, not scattered throughout and I’d like the HTML buttons on the ‘edit comment’ screen… since we are making a list ??

I’ll second all of those ??

Hey guys,

Thanks a lot for your help. I am going to try this and will let you know if it works. Sorry for the late response.
If you can, check back in a couple days.

Thanks

Lance

I’ll try to keep an eye on this thread … feel free to contact me directly if I miss your next update.

Hi,

apljdi – I did not modify the default “recent posts” widget – just using it as is.

cais – Thanks but your suggestion copied below did not do anything:

it appears you can take that little snippet of CSS posted above and ...

   1. Go to the theme options page
   2. Near the bottom click on "Add HTML/CSS inserts"
   3. Go to the bottom of that option page for "CSS Inserts"
   4. Add: div#recent-posts-3 div.widget ul li {margin-bottom: 10px;}
   5. Click on the HUGE Save Changes button

I could come up with some none too friendly terms for themes with too, too many options … *hehe*

Follow the same instructions but for line 4 try this:

div#recent-posts-3.widget.widget_recent_entries ul li{margin-bottom: 50px;}

Adjust the 50px to what height you want but use it as a firm test number to start with. The ‘#recent-post-3’ is not absolutely necessary but it is good form to include for specificity sake.

I installed and tested this, my recent post block was #recent-posts-2, but the style should hold.

PS: Note the lack of spacing, it is important.

Hi Cais,

I just copied and pasted that line in and it did not do anything. Nothing changed as far as I can see.

Any other suggestions?

Lance

You can try it without the ‘#recent-posts-3’ part …

div.widget.widget_recent_entries ul li{margin-bottom: 50px;}

… again, this is from my test install so there may be other differences to review still.

PS: I’ll see about looking at this again later … you can also look at your source code for the page and see what might be missing