Question

If you’re setting all the borders to be the same, you can simply do something like border: 1px solid #DDD. Now, if I need to do only 3 of them, I’m forced to write each one out like border-left: 1px solid #DDD, border-top: 1px solid #DDD, etc. Is there a way I can combine them into one line? Something like border-{left,right,top}: 1px solid #DDD

The simplest two line option I have is to first set all borders and turn one of them off. But I reset all borders to zero at the start of the script, so this is kind of redundant.

Answer 1

3 lines

div {
  border-color: red;
  border-style: solid;
  border-width: 1px 1px 1px 0;
}

2 lines

div {
  border: 1px solid red;
  border-left: 0;
}

See http://css-tricks.com/three-sided-border/