CSS formatted div borders do not appear on page(s)

Question

Hello all,
I have a website I'm developing using the Skeleton 960 grid. I have defined borders for ID #r_col_entrypage and applied them to the div by using <div class="five columns" id="r_col_entrypage">. The css for the borders is included in the layout.css and appears in design view within Dreamweaver; however, does not appear in any of the browsers I've tested it on - IE, Firefox or Chrome. At one point I had this working but then changed the layout of the page (decreasing some div widths). I have tried changing the size of the two divs that are next to each other - that didn't work, I've tried increasing or decreasing the padding in the css below thinking that perhaps my border was being overlapped and that didn't work either. I'm about out of ideas as to why it is not appearing and wondered if someone could take a look and see what might be happening. I know I have a lot of style sheets with this and that may very well be at the root of this. You can find one of the pages that I'm having trouble with at http://bpiads.org/newsite/donate.html. Thanks very much and let me know if there is any additional info you need.
#r_col_entrypage {
padding-left: 20px;
border-left: 5px solid #46673b;
border-bottom: none;
border-top: none;
border-right:none;
font-size:110%;
font-weight: bold;

Answer 1

webmom24 wrote:
Thank you... I had looked at the code so many times I wasn't "seeing" it. This did fix the problem of the border.
Now, however, my container that contains the navigation has tons of empty space above it which I am trying to figure out... any thoughts on what would be causing that? I tried changing the "height" from 40px to "auto" and that doesn't seem to make any difference.
Maureen
Thats because you have set min-height: 200px; on the "banner" <div> which preceeds your navigation <div>. The height of the image in the "banner" <div> is only 35px so NORMALLY you would set the height to 35px BUT you can't do that because you have used the id "banner" for the <div> above that as well, where the height of the image IS 200px. Only use an 'id' once on the page. Just delete the min-height and everything should be ok.
#banner {
    /*background-image:url(../images/bpi-banner-new.jpg);
    background-repeat: no-repeat;
    position relative;
    height: 200px;
    width: 940px;*/
    min-height:200px;
    min-width:940px;