How to style div with an inner border inside a div using CSS

December 28, 2020 admin

In this tutorial, you will learn how to place a border inside a div block in CSS by simply using the CSS3 box-sizing property with border-box value.

Code CSS :

div {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: 500px;
    height: 100px;
    border: 15px solid red;
    background: black;
    margin: 10px;
    color: #fff;
}

[st_adsense]

Code HTML :

<!DOCTYPE html>
<html>
	<head>
	<style type="text/css">
		/* Put the CSS Style Here */
	</style>
	</head>
	<body>
		<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
	</body>
</html>