CSS : Bad Gray Line to the side of the Navigation Bar on http://perl-begin.org/

Question

Hi all!

I'm maintaining the Perl Beginners' Site and used a modified template from Open Source Web Designs. Now, the problem is that I still have an undesired artifact: a gray line on the left side of the main frame, to the left of the navigation menu. Here's an image highlighting the undesired effect.

How can I fix the CSS to remedy this problem?

Regards,

-- Shlomi Fish

Answer 1

Shlomi... is that part of the Image thats dropping the shadow? My initial impression is that it looks like that's the case...

Answer 2

It's the background-image on the body showing through. Quick fix (edit style.css or add elsewhere):

#page-container
{
   background-color: white;
}

Answer 3

That is an image. (see it here: http://perl-begin.org/images/background.gif) It's set in the BODY class of your stylesheet.

Answer 4

I think it's this:

#page-container {
    border-left: solid 1px rgb(150,150,150); border-right: solid 1px rgb(150,150,150); 
}

However, I'm not seeing why the right border isn't showing up....

Answer 5

The grey line is supposed to be there. The reason why it looks odd is because the very top is hidden by the buffer element. Remove the background-color rule from this ruleset:

.buffer {
    float: left; width: 160px; height: 20px; margin: 0px; padding: 0px; background-color: rgb(255,255,255); 
}

Answer 6

I would do a quick fix on this to add the style:

border-left:2px solid #BDBDBD;

to the .buffer class

.buffer {style.css (line 328) background-color:#FFFFFF; border-left:2px solid #BDBDBD; /* Grey border */ float:left; height:20px; margin:0px; padding:0px; width:160px; }

Answer 7

I found the problem.

The problem is that you need to set a white background on #page-container. As things stand, it has a transparent background, so the 5pt left margin on navbar-sidebanner is revealing the bg of the page_container ... so change that bg and you're cool.

Answer 8

Thanks to all the people who answered. The problem was indeed the transparency of the #page-container and the background image of the body. I fixed them both in the stylesheet.

Answer 9

So my answer was correct?