How can I set a css border on one side only

Question

For a given div I would like to only display a border on the left  right  top  or bottom side    Currently I have the following  which puts a border on all sides     testdiv      border  1px solid      What do I need to do in order to have a border only on the left side

User · Accepted Answer

testdiv      border-left  1px solid      See the MDN documentation on border

User · Answer

You can specify border separately for all borders  for example    testdiv    border-left  1px solid  000    border-right  2px solid  FF0      You can also specify the look of the border  and use separate style for the top  right  bottom and left borders  for example    testdiv    border  1px  000    border-style  none solid none solid

User · Answer

Try like this   testdiv    border-left 1px solid

User · Answer

If you want to set 4 sides separately use   border-width  1px 2em 5px 0     top right bottom left    border-style  solid dotted inset double  border-color   f00  0f0  00f  ff0

User · Answer

div      border-left solid red 3px      border-right solid violet 4px      border-top solid blue 4px      border-bottom solid green 4px      background grey      width 100px  height 50px     DEMO

User · Answer

testDiv         set green border independently on each side        border-left  solid green 2px      border-right  solid green 2px      border-bottom  solid green 2px      border-top  solid green 2px

[css] How can I set a css border on one side only?

Examples related to css

Examples related to border