Core Code
Core Code Modern Dev Handbook

CSS Different Border Sides

Each side of a border can have a different style or color.

Preview

Code

<style>
.box{
border-top:3px solid red;
border-right:3px solid blue;
border-bottom:3px solid green;
border-left:3px solid purple;
padding:16px;
}
</style>

<div class="box">Different borders on each side</div>

More CSS Borders Examples (7)

example CSS Basic Border open example example CSS Border Width open example example CSS Border Style open example example CSS Border Color open example example CSS Border Radius open example example CSS Border Top open example example CSS Border Box Styling open example