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 · 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

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

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

User · Answer

Try like this   testdiv    border-left 1px solid

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      border-left  1px solid      See the MDN documentation on border

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

Examples related to css

Examples related to border