I want the border line on, for example, the bottom of the div or td not to extend the entire width of the div or td. There should be a gap on left and right. How do I achieve this in CSS?
Borders always extend the full padding-width of an element (right to the corners including any padding).
For the effect you desire, the element with the border would have to use a margin. This may require use of a wrapper element in some circumstances.