Om du skulle vilja göra ett block som ser ut

#tjosan {
   border-color: red;
   border-style: solid;
   border-top: 0;
   border-right: 4px;
   border-bottom: 0;
   border-left: 4px;
}

Detta kan sammanfattas till

#tjosan {
   border-width: 0 4px;
}

Det är nämligen så att man kan ange flera olika värden i följd. Om man anger två värden (i det här fallet 0 och 4px) så gäller det första värdet för top och bottom, det andra för right och left

Detta kan vidareutvecklas om vi gör följande block:

I ovanstående block är top 4px röd, right 8px grön, bottom 12px blå och left 16px gul. Detta kan uppnås på liknande sätt som i det förra exemplet, men med fyra värden i följd. Till exempel så här:

border-style: solid;
border-width: 4px 8px 12px 16px;
border-color: #ff0000 #00ff00 #0000ff #ffff00;


I det här fallen räknas värdena alltid medsols från top, alltså: top, right, bottom och left. Alltid i samma ordning. Tänk dig en klocka som börjar på klockan tolv.

Sammanfattning: vid två värden: top/bottom och sedan right/left.
Vid fyra värden: top, right, bottom och sedan left.

Om du kommer ihåg den ordningen kan du använda den i många olika sammanhang när du vill korta ned din kod.