I don't understand the console output of this code, I expected a height of 50 pixels and a width of 150 pixels but apparently this is not the case. Why do spaces appear between elements when no rules in my code ask for them? How to bypass this without imposing a specific size on the container. And why is he doing that?
console.log('Height : ' + document.querySelector('.Example').clientHeight);
console.log('Width : ' + document.querySelector('.Example').clientWidth);
.Example {
display: inline-block;
}
.Example > DIV {
display: inline-block;
height: 50px;
width: 50px;
background-color: red;
}
<!DOCTYPE html>
<html>
<head></head>
<body>
<div class="Example">
<div></div>
<div></div>
<div></div>
</div>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire