It draws the outline beyond the edge of the Border. It does
not take up space and it may be non-rectangular. Now we look at the example it
sets the outline 10px outside from the border edge.
<html>
<head>
<style type="text/css">
div
{
margin:230px;
width:200px;
padding:10px;
height:90px;
border:2px solid blue;
outline:2px solid pink;
outline-offset:10px;
}
</style>
</head>
<body>
<div>This div has an outline border 10px outside the
border edge.</div>
</body>
</html>
![]()
![]()
![1.png]()