reduce vertical space between divs

[mem]

Hello again :(

I'd like to reduce the vertical space between two divs so that the div on
top of the image stays close to the image, and the div at the bottom of the
image stays close to the image too.

Here's the example:

http://www.cantinho.org/pt/cantinho-site/layout3.html

I have reduce the padding of "box_no_bottom".
I have define the margin on " box_no_bottom" and "destaque" to 0.

The space difference don't disappear, what/where should I change to make
this work?

Thanks a lot once again,
Márcio

______________________________________________________________________
css-discuss [[hidden email]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[mem]

> The space difference don't disappear, what/where should I change to
> make this work?
 
Done. Hope the right way. :)

I've give negative margins to the container that holds the image, and the
space has shortened.
Something like:
.container .destaque
{
        margin-top:-5px;
        margin-bottom:-10px;
}

Regards,
Márcio

______________________________________________________________________
css-discuss [[hidden email]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[David Hucklesby-2]

MEM wrote:

>
> I'd like to reduce the vertical space between two divs so that the
> div on top of the image stays close to the image, and the div at the
> bottom of the image stays close to the image too.
>
> Here's the example:
>
> http://www.cantinho.org/pt/cantinho-site/layout3.html
>
> I have reduce the padding of "box_no_bottom". I have define the
> margin on " box_no_bottom" and "destaque" to 0.
>
> The space difference don't disappear, what/where should I change to
> make this work?
>

Well, you have a DIV class="bottom" between those two DIVs, with a
specified height of 13px. Is this creating the "vertical space" you see,
perhaps?

Cordially,
David
--

______________________________________________________________________
css-discuss [[hidden email]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[mem]

 > Well, you have a DIV class="bottom" between those two DIVs, with a
> specified height of 13px. Is this creating the "vertical space" you
> see,
> perhaps?
>

Thanks for the reply David,
Yes, the height is defined as 13px and that could solve the top space
(between the top div and the image), however, the bottom space (between the
image  and the bottom div) doesn't get solve. And I need that height,
because it's the height that defines the bottom shadow border effect.

I have, however, clean the bottom space of the div containing the img
element, by doing:
.container .destaque img {
    display: block;
}

And now I'm able to give symmetric negative margins on .destaque and allow a
more closer effect, not the best approach on this case...?


Regards,
Márcio


______________________________________________________________________
css-discuss [[hidden email]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[David Hucklesby-2]

MEM wrote:
[...]
>
> And now I'm able to give symmetric negative margins on .destaque and
> allow a more closer effect, not the best approach on this case...?
>
Using margins for positioning has always worked well for me - both
positive and negative margins. I don't think you'll have any problem
with your solution.

Cordially,
David
--

______________________________________________________________________
css-discuss [[hidden email]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/