Я начал изучать HTML на этой неделе и надеялся создать свой собственный сайт, используя bootstrap. Однако я столкнулся с самой любопытной ошибкой, поскольку простой код, который должен создать строку с двумя фрагментами текста в одной строке, не работает для одного фрагмента кода, а работает для другого, даже если два абсолютно идентичны .
Ниже приведен код, который я запускаю:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<!-- Below: My original code that wasn't working, boiled down to be as simple as possible -->
<div class=“row”>
<div class="col-4">
I'm foo
</div>
<div class="col-8">
I'm bar
</div>
</div>
<!-- Below: Code I appropriated from https://blog.theodo.com/2018/03/stop-using-bootstrap-layout-thanks-to-css-grid/ -->
<div class="row">
<div class="col-4">
I'm foo
</div>
<div class="col-8">
I'm bar
</div>
</div>
</div>
</body>
</html>
Я запустил этот код как на своей локальной машине, так и в онлайн-компиляторе HTML и получил следующий результат :
Так почему один и тот же код выводит другой результат? Почему текст в верхней строке имеет отступ, а другой - нет? Я попытался переключить порядок двух строк, но это все равно не имело значения. Я действительно в тупике. Буду признателен за любую помощь, которую вы можете мне дать.