Unable to see the bottom of border

Web Design Forum

Convenient web based access to our favorite web design Usenet groups

Web Design > Web Design > Stylesheets > Unable to see the bottom of border

This is Interesting: Free Magazines for Graphics designers and webmasters

Last Thread Next Thread

Author

Thread

Unable to see the bottom of border

eomer

12-17-05 - 12:56 AM

Hi all,

If you were to go to the following web site -
http://www1.esc.edu/personalstu/fhartnet/grade7.html

and take a look at the content panel using IE6, you will notice that
the border bottom does not really show. If using Mozilla it is visible
(sort of).

I'm not certain how to fix this? Here is the CSS. Thanks in advance.

div#gr7content{
position: absolute;
left: 29%;
top: 5px;
width: auto;
border: 2px double #7FC07F;
background: white;
color: black;
padding: 2px;
/*margin-right: 5px;*/
}

div#gr7content h3{
background: #92E292;
color: black;
text-align: center;
letter-spacing: 1px;
/*color: black;*/
margin-top: 0px;
padding: 2px;
border-bottom: 1px solid black;
}

[ Post Follow-Up to this message ]

Re: Unable to see the bottom of border

Jim Moe

12-17-05 - 12:56 AM

eomer wrote:
>
> If you were to go to the following web site -
> http://www1.esc.edu/personalstu/fhartnet/grade7.html
>
> and take a look at the content panel using IE6, you will notice that
> the border bottom does not really show. If using Mozilla it is visible
> (sort of).
>
It's the position:absolute that is causing it. When positioned in such a
way, any padding specs, default or explicit, are ignored.
Since the nav panel is also position:absolute, there is no need to
position the main content that way.
In div#gr7content
remove:
position: absolute;
left: 29%;
top: 5px;
add:
margin-left: 29%;

P.S.: You have not specified a fore- and background color for <body> in
your CSS. Set your browser to non-defaults for those and see how your site
looks then.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

[ Post Follow-Up to this message ]