blob: 28fdee8167047a1b05f359a36e9bea6ba8a26133 [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<style>
:root {
--focus-ring-size: 3px;
--input-width: 160px;
--input-height: 20px;
--border-width: 1px;
}
#overlay {
position: absolute;
top: var(--focus-ring-size);
left: var(--focus-ring-size);
background-color: red;
border: var(--border-width) solid red;
width: calc(var(--input-width) + 2 * var(--focus-ring-size));
height: calc(var(--input-height) + 2 * var(--focus-ring-size));
}
</style>
</head>
<body>
<div id="overlay"></div>
</body>
</html>