Меню Bootstrap 3 Options Disappears
У меня есть таблица из 4 столбцов, использующая сетку Bootstrap 3. Вместо использования col-xs-*
, который отлично работает на мобильных устройствах, я использовал col-md-*
. Причина была проста - на мобильных устройствах я не хотел, чтобы значки сжимались очень маленькими и хотели, чтобы они были более крупными и видимыми на мобильных устройствах. Когда я переключался с col-xs-*
на col-md-*
для этих столбцов, мобильная станция автоматически складывала значки в сетке и держала их большими - что именно то, что я хочу.
Хорошо, все хорошо, за исключением того, что каким-то образом это уменьшает ширину документа, а меню параметров (меню выпадающего меню с тремя барами для мобильных телефонов/планшетов) исчезает , потому что оно выравнивается к ширине документа, а не ширине окна просмотра.
Кто-нибудь знает хорошее исправление CSS для этой общей проблемы?
Ответы
Ответ 1
Я нашел причину своей проблемы. Это произошло не из-за чувствительных столбцов. Это связано с тем, что внутри моих чувствительных столбцов я выполнял абсолютное позиционирование в относительном контейнере, чтобы мой тег P
выравнивался в нижней части окна, но тогда мой текст не был центрирован, поэтому я применил это:
.box P
{
position:absolute;
bottom:5px;
left:-50%;
right:-50%;
}
Когда я это сделал, он заставил меню опций перейти на экран. Исправлено, что я переключил левый и правый так:
.box P
{
position: absolute;
bottom: 5px;
left:0;
right:0;
}
Этот центрированный текст тега P внутри реагирующих столбцов, но все же позволил мне использовать абсолютное позиционирование внутри поля сетки, которое было установлено на position:relative
. Это привело к тому, что ширина документа снова стала нормальной, и, таким образом, появилось меню параметров.