controlling border length

Question

i want to limit the border length applied to a div element(or any HTML elements) . For example consider a div of width 100px, is there anyway to apply the border to only 40px width itself?

Answer 1

You will need to use a child div of the appropriate width to do that. For example:

<div id="outer">
  <div id="border"></div>
  <p>...</p>
</div>

with:

#outer { width: 100px; padding-top: 0; }
#border { width: 40px; border-top: 1px solid black; margin-top: 0; }

Answer 2

You need to use a nested div or a narrow image as background.

Try not to add a div only to display the border, always try to be semantic. Probably your design need a supplementary section.