Title: [Plugin: Mini Loops] CSS Styling
Last modified: August 20, 2016

---

# [Plugin: Mini Loops] CSS Styling

 *  Resolved [ChrisStoneman](https://wordpress.org/support/users/chrisstoneman/)
 * (@chrisstoneman)
 * [14 years, 8 months ago](https://wordpress.org/support/topic/plugin-mini-loops-css-styling/)
 * I’d previously used your advanced-most-recent-posts-mod plugin, and you’d suggested
   to use the below styling. How can this be modified to suit the new mini-loops
   plugin?
 *     ```
       ul.advanced-recent-posts { list-style:none; line-height:1.35em; margin:0;}
       ul.advanced-recent-posts li { clear:both;width:100%;margin: 0 0 15px;}
       ul.advanced-recent-posts a { font-weight:normal; }
       ul.advanced-recent-posts img { float:left; margin:0 10px 0 0; padding:2px;border:none; }
       ```
   
 * Thanks
 * [http://wordpress.org/extend/plugins/mini-loops/](http://wordpress.org/extend/plugins/mini-loops/)

Viewing 6 replies - 1 through 6 (of 6 total)

 *  Plugin Author [Kailey (trepmal)](https://wordpress.org/support/users/trepmal/)
 * (@trepmal)
 * [14 years, 8 months ago](https://wordpress.org/support/topic/plugin-mini-loops-css-styling/#post-2291127)
 * You should be able to adjust the css selectors like this
 *     ```
       .miniloops ul { list-style:none; line-height:1.35em; margin:0;}
       .miniloops ul li { clear:both;width:100%;margin: 0 0 15px;}
       .miniloops ul a { font-weight:normal; }
       .miniloops ul img { float:left; margin:0 10px 0 0; padding:2px;border:none; }
       ```
   
 * If that doesn’t work, your theme may be interfering.
 * Alternatively, you can add the ‘advanced-recent-posts’ class to the mini loops
   output.
 * If the Before Item field still has the default `<ul>` you can change that to `
   <ul class="advanced-recent-posts">` That should make your original styles work
   without modification.
 *  Thread Starter [ChrisStoneman](https://wordpress.org/support/users/chrisstoneman/)
 * (@chrisstoneman)
 * [14 years, 8 months ago](https://wordpress.org/support/topic/plugin-mini-loops-css-styling/#post-2291135)
 * I’ve tried both these methods but neither work. How can I make it override my
   theme? Is there anything in the theme’s files I should look out for?
 *  Plugin Author [Kailey (trepmal)](https://wordpress.org/support/users/trepmal/)
 * (@trepmal)
 * [14 years, 8 months ago](https://wordpress.org/support/topic/plugin-mini-loops-css-styling/#post-2291142)
 * You might have more success looking at the source code, or using a tool like 
   Firebug or the Developer Tools built into the webkit browsers to get the actual
   classes/ids surrounding the Mini Loops output.
 * Since there is so much variation in themes, it’s hard say what change is needed
   to make the CSS work correctly. There could be other styles with more specific
   selectors that take priority over the above styles.
 * If you can provide a link to the site in question, I can take a look.
 *  Thread Starter [ChrisStoneman](https://wordpress.org/support/users/chrisstoneman/)
 * (@chrisstoneman)
 * [14 years, 8 months ago](https://wordpress.org/support/topic/plugin-mini-loops-css-styling/#post-2291151)
 * I’ve fixed most of it using this approach. You can see my site at [http://www.wordsaboutmusic.co.uk](http://www.wordsaboutmusic.co.uk)
   Two questions….
 * – when the title of a post if long, it creates a gap in the mini-loops list. 
   How is this corrected?
 * – I have called mini-loops twice, once for recent and once for random posts. 
   The code is identical, yet the second has bullet points. I’ve tried adding this
 * `.miniloops ul {list-style-type: none;}`
 * to my CSS but no use. How do I remove the bullet points?
 *  Plugin Author [Kailey (trepmal)](https://wordpress.org/support/users/trepmal/)
 * (@trepmal)
 * [14 years, 8 months ago](https://wordpress.org/support/topic/plugin-mini-loops-css-styling/#post-2291156)
 * It looks like you’re using a bunch of ‘
   ‘ tags to prevent the images from staggering–
   I think this is why you having bigger gaps following longer titles. Try removing
   the `<br />` tags and adding this to your CSS:
 *     ```
       .randomposts ul li,
       .recentposts ul li {
           overflow:hidden;
       }
       ```
   
 * There appears to be a broken `div` tag surrounding the random posts (missing “
   >”)
 * `<div class="randomposts"`
 * Fixing that should fix the bullet point issue.
 *  Thread Starter [ChrisStoneman](https://wordpress.org/support/users/chrisstoneman/)
 * (@chrisstoneman)
 * [14 years, 8 months ago](https://wordpress.org/support/topic/plugin-mini-loops-css-styling/#post-2291161)
 * Worked perfectly. Thanks so much.

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘[Plugin: Mini Loops] CSS Styling’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/mini-loops_f7f7f7.svg)
 * [Mini Loops](https://wordpress.org/plugins/mini-loops/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/mini-loops/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/mini-loops/)
 * [Active Topics](https://wordpress.org/support/plugin/mini-loops/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/mini-loops/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/mini-loops/reviews/)

 * 6 replies
 * 2 participants
 * Last reply from: [ChrisStoneman](https://wordpress.org/support/users/chrisstoneman/)
 * Last activity: [14 years, 8 months ago](https://wordpress.org/support/topic/plugin-mini-loops-css-styling/#post-2291161)
 * Status: resolved