1

I have two questions applying to my website.

Please view the source to help answer these two questions.

  1. I want the border inside the div "nav-cont-seperator" to be shifted down 10px. I can't get padding to fix this problem, probably because borders ignore padding.

  2. My second question is, how do I make that vertical border go to the bottom of the page (make the div match the height of its parent), minus 10px?

Alex
  • 9,313
  • 1
  • 39
  • 44
Keavon
  • 6,837
  • 9
  • 51
  • 79

1 Answers1

5

  1. If I understand you correctly, you need a margin-top: 10px; on that div. Containers in HTML respect the box model (you can see that in firebug, for instance), meaning that the size of the element is given by: margin + border + padding. Padding applies to the inner part of a border, margin to the outside.

  2. I'm not sure there's a clear way of doing that with pure HTML/CSS. Let me ask you another question... are you sure you need that div? Couldn't that separator be the right-side border of the left menu div? That might solve your problem and clear up some markup.

Anyway, if you're using jQuery, the answer here: how to size a div's height to its container height, using CSS? might be of help!

Community
  • 1
  • 1
pcalcao
  • 15,789
  • 1
  • 44
  • 64
  • Awesome! Thank you! It worked! And I just added the border as a left border to the content div, so as long as it's lower than the navigation, I'm fine. Thank you!!!! – Keavon Oct 01 '11 at 18:13