Идентичный bootstrap код столбца функционирует по-разному - PullRequest
0 голосов
/ 29 апреля 2020

Я начал изучать 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 и получил следующий результат : output of code above in mozilla firefox, google chrome, and an online HTML compiler (https://www.onlinegdb.com/online_html_compiler)

Так почему один и тот же код выводит другой результат? Почему текст в верхней строке имеет отступ, а другой - нет? Я попытался переключить порядок двух строк, но это все равно не имело значения. Я действительно в тупике. Буду признателен за любую помощь, которую вы можете мне дать.

1 Ответ

1 голос
/ 29 апреля 2020

В девятой строке вы написали «вместо». Выглядит почти так же, но имеет значение!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...