Please try this code.
<!DOCTYPE html>
<html>
<head>
<style>
div {
background-color: lightgrey;
width: 50px;
border: 25px solid green;
padding: 10px;
margin-right: 10px;
margin-left: 10px;
margin-top: 10px;
margin-bottom: 10px;
}
</style>
</head>
<body>
<h2>Testing Margins</h2>
<div style="display:inline-block;">Box 1</div>
<div style="display:inline-block;">Box 2</div>
<br />
<div style="display:inline-block;">Box 3</div>
<div style="display:inline-block;">Box 4</div>
</body>
</html>
Then try it with all four margins set to 0px.
Does the left and right margins completely disappear. For me, I still see some margin on the left and right. How can I get the left and the right margins to completely disappear?