Margin problem

[Brian Tozer]

In the following site:-

http://members.cox.net/netlane-designs/netlanedesigns.html

when I add extra content to the bordered content area at the right of the
menu box, the content box height expands as expected, until it's bottom
border is below the bottom of the viewport.
Using CSS I have been unable to create a 20px margin below the content box
so that there is background image visible there.
I am somewhat familiar with CSS and have tried many semi-obvious things to
no avail.
Any help would be appreciated.

Brian Tozer

 

[Mitja]

In the following site:-

http://members.cox.net/netlane-designs/netlanedesigns.html

when I add extra content to the bordered content area at the right of
the menu box, the content box height expands as expected, until it's
bottom border is below the bottom of the viewport.
Using CSS I have been unable to create a 20px margin below the
content box so that there is background image visible there.
I am somewhat familiar with CSS and have tried many semi-obvious
things to no avail.
Any help would be appreciated.

Brian Tozer

Because you use absolute positioning. Absolutely positioned elements don't
take any space in structure flow, so the margin doesn't count because your
div is non-existent as far as the flow is concerned. Use something like

div#content {

border-right: #444 5px solid;

padding-right: 10px;

border-top: #444 5px solid;

padding-left: 10px;

margin-right: 25px;

background: #000000;

margin-left: 170px;

padding-bottom: 10px;

font: 13px arial, sans-serif;

border-left: #444 5px solid;

color: #678062;

padding-top: 10px;

border-bottom: #444 5px solid;

/*position: absolute;*/

margin-top: 60px;

margin-bottom: 100px;

}

 

[Whitecrest]

In the following site:-
http://members.cox.net/netlane-designs/netlanedesigns.html

Too hard to read it, the green shades are too close for people with
Deuteranopia

 

[Brian Tozer]

Because you use absolute positioning. Absolutely positioned elements don't
take any space in structure flow, so the margin doesn't count because your
div is non-existent as far as the flow is concerned.

Wonderful. Thanks very much Mitja.
Another lesson learnt.
Brian