Почему HTML-страница не подходит для 100%?
Всякий раз, когда я хочу сделать HTML-страницу, у меня возникают проблемы с этим, почему HTML-страница меньше 100%? Позвольте мне объяснить в примере:
<!doctype html>
<html>
<head>
<title>Test</title>
<style>
html
{
margin: 0;
padding: 0;
width: 100%;
}
body
{
margin: 0;
padding: 0;
}
.row
{
width: 100%;
margin: 0 auto;
padding: 0;
}
.col-1
{
width: 10%;
margin: 0;
padding: 0;
display: inline-block;
}
</style>
</head>
<body>
<div class="row">
<div class="col-1">Some text</div>
<div class="col-1">Some text</div>
<div class="col-1">Some text</div>
<div class="col-1">Some text</div>
<div class="col-1">Some text</div>
<div class="col-1">Some text</div>
<div class="col-1">Some text</div>
<div class="col-1">Some text</div>
<div class="col-1">Some text</div>
<div class="col-1">Some text</div>
</div>
</body>
</html>
Почему последний div приходит на следующую строку? При всей ширине 10% мы можем добавить 10 делений в строке, но в реальном мире этого не происходит ?! Я проверил все поля, отступы, границы, но ничего не увидел. Не могли бы вы сказать мне, почему это происходит?