The content area is anything left after you subtract the width of the border.
| The content width and height are calculated by subtracting the border and padding widths of the respective sides from the specified ‘width’ and ‘height’ properties.
Specified width = 10 px
border width = 10 px
Content width = Specified width (10 px) - border width (10 px)
Content width 10 - 10 = 0
Specified width = 0 px
border width = 10 px
Content width = Specified width (0 px) - border width (10 px)
Content width 0 - 10 = -10 ( which would remove the 10 px used by the border)
But
| As the content width and height cannot be negative ([CSS21], section 10.2), this computation is floored at 0.
Specified width = 0 px
border width = 10 px
Content width = Specified width (0 px) - border width (10 px)
Content width 0 - 10 = 0 ( which doesn't remove the 10 px used by the border)
If you don't want to use display:none; or visibility:hidden;, you need to set both the width:XX; and the border-right:XX; to zero.