I created a widget called "benefit-widget" and would like to have "0" margin for this specific widget. As is, the overall Atahualpa theme 3.7.1. adds a 15px margin at the bottom. Below this widget, I have a menu bar and so have an unwanted 15 pixel gap between this widget and the menu bar.

I tried adding this to the HTML/CSS Inserts:

div#benefit-widget { margin: 0 !important;}

I Tried,
div#benefit-widget { margin: -10 !important;}

I tried,
div#benefit-widget { margin: "" !important;}

I tried,
div#benefit-widget { margin: "0" !important;}

and I tried,
div#benefit-widget { margin: "0 0 0 0" !important;}


None of the above worked. Is this the correct way to specify a margin for a specific widget? I don't want to change margins for the other widgets -- only this one.

Thanks very much

Without knowing what the HTML structure of the widget is, it is hard to say. Try using firebug in firefox to examine the area and experiment. What is the url

Hi JD,
URL is http://bestselectedgamesforseniors.com

When you go in there now, you won't see any gap. That is because in ATA options, style widgets, widget container, I changed margin: 0 0 15px 0; To margin: 0 0 0px 0;

But that also "smushes" up the other category widgets. So what I'm looking for is to style only the benefit-widget.

Thanks in advance,

You have

div#benefit-widget{margin:"0 0 0 0" !important}

that is invalid, no quotes. If you want th margin to be 0 use

div#benefit-widget{margin:0 0 0 0 !important}

JD,
I put the following code into custom html/css: div#benefit-widget{margin:0 0 0 0 !important}
and set the wiget theme settings back to default but now the gap is back.

I feel like such a firebug "clutz". I have absolutely no idea how you can look at a widget like that and find the margin coding.
When I look, I don't see that.

see any difference between

<div id="benefit_widget" class="bfa_widget_area">

and

div#benefit-widget {margin:0 30px 0 40px !important;}

look careful and then don't kick yourself when you find it.