Posted by Els on 07/29/06 13:41

Beauregard T. Shagnasty wrote:

> Els wrote:
>
>> Beauregard T. Shagnasty wrote:
>>
>>> Chris wrote:
>>>
>>>> It's probably not what you meant but I added an emtpy paragraph at
>>>> the bottom with its margin set to 0 and its working. It didn't seem
>>>> to work on the margin.
>>>
>>> Not a good idea. Some browsers may completely collapse an empty
>>> element, thus giving you no benefit. Add the padding to the last
>>> real paragraph as already stated.
>>>
>>> #maincenter p {padding: 2em; }
>>
>> Wasn't stated by me though ;-)
>> My suggestion was #maincenter {padding-bottom:1px;}
>
> Unfortunately, "#maincenter" has the following inline style:
> <div id="maincenter" style="padding:0px;margin:0px;" class="test">
> so adding your padding-bottom would be overridden. 'Tis why I added the
> p to it. ;-)

Yes, but it won't have the desired effect.
The inline style is why I described the solution as "give #maincenter
a bottom padding", instead of the short rule I just mentioned.
Nevertheless, make it like this:
#maincenter{padding-bottom:1px !important;}
and it will overrule the inline style. (I think it's better if the OP
takes out those inline styles though)

>> The padding on the paragraph will not stop the margin of it collapsing
>> with the 0 margin of the div around it, which is causing the space.
>
> I thought we were trying to add some space ...

No, he wants the left and right borders to continue downwards,
touching the graphics.

> the test page sure could use a bit.

Yup, it sure could. It could also do with splitting that paragraph up
in two paragraphs, and a border right on that image in the bottom
right ;-)

--
Els http://locusmeus.com/

[Back to original message]