CSS Media Query для группировки Float-Start Bootstrap5.2 ⇐ CSS

[Anonymous]

Я внедрил форму электронной почты в HTML/CSS с использованием Bootstrap 5.2. Он выглядит хорошо в представлении на рабочем столе, а также в мобильном представлении, но у него есть некоторые проблемы на экранах среднего размера. Проблема присутствует в диапазоне (мин-ширина: 520px) и (максимальная ширина: 991px), поэтому я уже настроил медиа-запрос, но я не знаю, что войти. CSS: < /p>

Код: Выделить всё

#surname_text {
font-weight: 700;
width: 90px;
}

#surname_input {
width: 300px;
height: 30px;
margin-bottom: 20px;
}

#given_name_text {
font-weight: 700;
width: 130px;
text-align: right;
}

#given_name_input {
width: 300px;
height: 30px;
margin-bottom: 20px;
}

#email_text {
font-weight: 700;
width: 140px;
}

#email_input {
width: 300px;
height: 30px;
margin-bottom: 20px;
}

#message_text {
font-weight: 700;
width: 160px;
}

#message_input {
width: 100%;
height: 250px;
margin-bottom: 20px;
}

#message_button {
width: 130px;
height: 30px;
margin-bottom: 20px;
background-color: #f46530;
font-weight: 700;
color: #E7E7E7;
border: 3px solid #0c0c0c;
}

#message_button:hover {
background-color: #0c0c0c;
}

@media (max-width: 519px) {
#given_name_text {
text-align: left;
}
}

@media (min-width: 520px) and (max-width: 991px) {

}< /code>


Contact Us
Use this form Use this form Use this form Use this form Use this form Use this form Use this form Use this form Use this form Use this form Use this form Use this form
Use this form Use this form Use this form Use this form Use this form Use this form Use this form Use this form Use this form Use this form Use this form Use this form


Surname:

Given name:


E-mail address:


Your message:


Send message

изображение выпуска

Подробнее здесь: https://stackoverflow.com/questions/740 ... otstrap5-2