Can someone help me with this simple CSS issue that's driving me crazy?

[slobizman]

You know how it is, you can do all sort of things right, and then you end up spending hours on some little, stupid CSS issue. That's where I am, and it's on something that should take me five seconds.

Here's my site: 3Dprinter.net. In the right sidebar, I just changed out the Catalyst Recent Posts widget to the Wordpress Popular Posts widget. Got it working fine except for one thing. That is, I'm just trying to add a bit of padding to the left side of the small thumbnail. But I can't get anything to work.

Here's the CSS I have for the the plugin:

.wpp-post-title {
font-size:1.2em;
}

/* thumbnail styles */
img.wpp-thumbnail {
	border:none;
        float:right;
        padding-left:10px;
}

The padding-left has no effect. The float:right does, so I know it's recognizing img.wpp-thumbnail, and Firebug confirmed it. I also tried making an "a img.wpp-thumbnail" element too, but that didn't work.

Can someone tell me what I'm doing wrong?

[eric]

Two quick tips for you:

1. When a style is just not having an effect like that then it's most likely that another bit of CSS is overriding it. One simple way of testing/solving this is to use the !important tag like this:

/* thumbnail styles */
img.wpp-thumbnail {
	border:none;
        float:right;
        padding-left:10px !important;
}

2. When testing this on your site it did in fact work, but you actually want a margin-left, not a padding-left as the padding-left pushes the thumbnail border out.

So try this code instead:

/* thumbnail styles */
img.wpp-thumbnail {
	border:none;
        float:right;
        margin-left:10px !important;
}

I'm still using the !important tag because it was being overridden as well.

This is the actual CSS code that is overriding yours:

#sidebar-1 a img, #sidebar-2 a img, #ez-home-sidebar-1 a img {
border: none;
margin: 0;
padding: 0;
}

So the other way to go about this is to add the #sidebar-1 ID before your styles to make it override the above without the need for the !important tag like so:

/* thumbnail styles */
#sidebar-1 img.wpp-thumbnail {
	border:none;
        float:right;
        margin-left:10px !important;
}

Hope that helps.

Also, regarding your opening statement, YES, I do that all the time and it frustrates the heck out of me! I'll be all kinds of efficient the first half of the day, knocking out complicated stuff left and right and then I'll spend the second half of the day stuck on something that seems like it should take no longer than a single song from Pandora to accomplish.

Eric

[slobizman]

Thanks Eric! I remember trying something with the #sidebar-1, but obviously didn't do something right.

Hey - have you ever thought of adding a popular posts option to your fabulous Recent Posts widget? I love that widget, but had to switch away do to this. I know it would involve adding a view counter to the database, plus some other coding, but it would be awesome.

[eric]

I haven't really thought that much about adding that, but I totally agree it could be a useful addition. You might want to throw out this suggestion to Michael who created the "Catalyst Excerpts PLUS" Widget:
http://catalysttheme.com/forum/showt...0954#post20954

It's like the stock Widget on steroids. He might be interested in adding something like that in the future.

Eric

[slobizman]

Can't access the page at the link that you gave me.

[justme]

I’m not sure why.That thread is in a sub forum that any regular forum member should have access to. Here is the main thread link: http://catalysttheme.com/forum/showt...xcerpts-(Plus)

If you still have problems accessing it you might want to send us your license information at http://catalysttheme.com/forum/sendmessage.php.

[eric]

Actually, I think that's in the Marketplace Free Plugins download section which is only accessible to Personal and Developer Edition members.

Here's a direct link to the download of that Plugin:
http://wordpress.org/extend/plugins/...excerpts-plus/

And if you wanted to ask about it you would always just start a new thread in the General Discussion section or something like that, mentioning that particular plugin and your suggestion.

Eric

[justme]

Ah right, forgot about the Basic license.

[slobizman]

Ah right, forgot about the Basic license.

I just bought Personal license. I didn't need it for my work, but I love Catalyst so much I thought what the heck. So I went and posted on the Catalyst Excerpts thread.

[eric]

Thanks for your support! Always appreciated.

Eric