Title: Adding Space Between Lines in a “Recent Posts” widget Last modified: August 19, 2016 --- # Adding Space Between Lines in a “Recent Posts” widget * [lance007](https://wordpress.org/support/users/lance007/) * (@lance007) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/) * Hi, * Please look at my site at [http://www.lancesview.com](http://www.lancesview.com) On the right sidebar I have a standard text widget for Recent Posts that I took from WordPress default widgets. * (1) How do I space out the links to the recent posts in the widget so that there is a clear separation between all of them. Right now they seem to run together. * (2) Is there a way to alternate the text or background color of each post in the “recent post” widget on the right sidebar to distinguish the posts even further? * I already tried to add the following code to my style.css sheet and to areas of the Atahualpa template that have options for adding code such as: “Body style, Text & Links” “Style and Configure Sidebars” -> “Right Sidebar style” “Style Widgets” -> “Widget content Box” * `#right #recent-posts-3 ul li { margin-bottom:10px; }` * NOthing has worked so far. * Does anyone have any other suggestions? * Thanks * Lance Viewing 13 replies - 1 through 13 (of 13 total) * [Edward Caissie](https://wordpress.org/support/users/cais/) * (@cais) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232512) * 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; } ``` * [s_ha_dum](https://wordpress.org/support/users/apljdi/) * (@apljdi) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232520) * 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 `` 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. * [Edward Caissie](https://wordpress.org/support/users/cais/) * (@cais) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232563) * [@apljdi](https://wordpress.org/support/users/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. * [s_ha_dum](https://wordpress.org/support/users/apljdi/) * (@apljdi) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232599) * > [@apljdi](https://wordpress.org/support/users/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. * [Edward Caissie](https://wordpress.org/support/users/cais/) * (@cais) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232600) * > We were posting at the same time. I didn’t see your post until after mine went > up * [@apljdi](https://wordpress.org/support/users/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.) * [s_ha_dum](https://wordpress.org/support/users/apljdi/) * (@apljdi) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232611) * 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 🙂 * [Edward Caissie](https://wordpress.org/support/users/cais/) * (@cais) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232612) * I’ll second all of those 🙂 * Thread Starter [lance007](https://wordpress.org/support/users/lance007/) * (@lance007) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232653) * 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 * [Edward Caissie](https://wordpress.org/support/users/cais/) * (@cais) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232654) * I’ll try to keep an eye on this thread … feel free to contact me directly if I miss your next update. * Thread Starter [lance007](https://wordpress.org/support/users/lance007/) * (@lance007) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232658) * 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 ``` * [Edward Caissie](https://wordpress.org/support/users/cais/) * (@cais) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232659) * 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. * Thread Starter [lance007](https://wordpress.org/support/users/lance007/) * (@lance007) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232662) * 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 * [Edward Caissie](https://wordpress.org/support/users/cais/) * (@cais) * [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232663) * 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 Viewing 13 replies - 1 through 13 (of 13 total) The topic ‘Adding Space Between Lines in a “Recent Posts” widget’ is closed to new replies. ## Tags * [widget](https://wordpress.org/support/topic-tag/widget/) * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/) * 13 replies * 3 participants * Last reply from: [Edward Caissie](https://wordpress.org/support/users/cais/) * Last activity: [16 years, 7 months ago](https://wordpress.org/support/topic/adding-space-between-lines-in-a-recent-posts-widget/#post-1232663) * Status: not resolved ## Topics ### Topics with no replies ### Non-support topics ### Resolved topics ### Unresolved topics ### All topics