Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Sidebars & Widgets (http://forum.bytesforall.com/forumdisplay.php?f=14)
-   -   [SOLVED] Removing the padding a single widget container using CSS - Please help! (http://forum.bytesforall.com/showthread.php?t=13502)

Kmax Mar 25, 2011 09:35 PM

[SOLVED] Removing the padding a single widget container using CSS - Please help!
 
First I would like to say thank you for a truly amazing theme. Without Atahualpa, I would not be able to create my website. I believe I will be making a donation very soon.

I've spent the past week creating a new story-sharing site called www.mybeijingstories.com. I've been a frequent lurker on this forum and found many fixes here already. For other problems, I've used online tutorials. However, there is one issue that I just haven't been able to solve on my own.

I've been using a great plugin called Wizzart - Recent Comments. It works just like I wanted. When you hover over the widget displayed in the left sidebar, the background turns yellow. Everything is fine except that there's too much left padding on the widget container, so there's a white space when you hover too. there's also too much on the top and bottom, so you see white spaces there too. It's not a problem with the widget itself, but the container.

I've styled my widgets so that they all have some padding, as when I removed the bullets the text was too far to the left. I'm happy with how everything on my sidebars look EXCEPT this one widget. I've tried every kind of CSS insert, using !important, but nothing seems to work. The page source suggests the widget name is this:

HTML Code:

<div id="wizzart-recent-comments-3" class="widget wizzart_recent_comments_widget"><div class="widget-title"><h3>Recent Comments</h3></div><ul class="recent-comments-list"><li class="recent-comment">
but I've had no luck using a CSS insert with it. If I could just add some padding to the right to this single container, I would be happy too. I hate to ask for code, but could someone please help me with this? I'm sure it's something very simple that I'm missing, but I just can't figure it out.

Thank you so much!

lmilesw Mar 25, 2011 10:30 PM

This took a bit of fiddling and I didn't test in IE but try adding the following in ATO>Add HTML/CSS Inserts>CSS Inserts
HTML Code:

#wizzart-recent-comments-3 {
    padding-bottom: -0px;
    overflow: hidden !important;
}
.comment-link {
    width: 165px;
    left: -10px !important;
    position: relative;
    top: -2px;
    margin-bottom: -4px !important;
}


Kmax Mar 26, 2011 06:23 AM

Dear lmilesw,

Thank you so very much for your quick reply and fix. That did the trick, and it works in IE too. Now my site looks more professional than ever. Again, thank you for taking the time to help me with this - I truly appreciate it.

Now let me see about that donation :)


All times are GMT -6. The time now is 02:12 PM.

Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.