Захотелось сделать форму обратной связи с помощью Bootstrap с прикреплением файла и рекапчей, но не могу догадаться, как сделать так, чтобы всё работало хорошо и правильно в стилях.
В источник статьи вставляю следующее:
<form id="form1">
<div class="form-row">
<div class="col">
<input name="formData" type="hidden" value="Заголовок формы" />
<input class="name form-control" name="name" placeholder="Представьтесь, пожалуйста" type="text" />
</div>
</div>
<div class="form-group">
<label class="col-form-label" for="recipient-mail">Ваш email:</label>
<input class="email form-control" id="recipient-mail" name="email" placeholder="example@mail.ru" type="text" />
</div>
<div class="form-group">
<label class="col-form-label" for="recipient-phone">Ваш телефон:</label>
<input class="phone form-control" id="recipient-phone" name="phone" placeholder="+7" type="text" />
</div>
<div class="form-group"><label class="col-form-label" for="message-text">Сообщение:</label>
<textarea class="message form-control" id="message-text" name="message" placeholder=""></textarea>
</div>
<button class="btn btn-primary" type="submit">Заказать</button>
</form>
Но как и понятно из-за того что стили Bootstrap не подключены, оно и не будет отображаться нормально.
Тогда я попытался сделать следующее:
Вставив перед формой следующую строчку:
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
Но тогда всё поехало, меню справа куда-то пропало и так далее.
Подскажите, пожалуйста, как исправить данную проблему?