Bootstrap плавающий боковой бар - PullRequest
Новая
       30

Bootstrap плавающий боковой бар

0 голосов
/ 02 сентября 2018

https://www.bootply.com/101100#

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

А также, есть ли способ заставить это вести себя должным образом на мобильном телефоне?

Спасибо!

1 Ответ

0 голосов
/ 04 октября 2018

Боковая панель структурирована как содержимое столбца в этом примере. Он выровнен по левому краю первого столбца, который выровнен по левой стороне строки и, в конечном счете, по левой стороне контейнера. Это стандартная структура Bootstrap. Вы можете рассмотреть возможность использования container-fluid, чтобы развернуть весь макет вашей страницы ближе к краям области просмотра.

Чтобы сохранить существующую ширину страницы, вы можете переместить боковую панель с отрицательным полем: 

.sidebar-nav-fixed {
    margin-left: -30px;
}

Это сдвигает боковую панель от ее нормального расположения в сетке.

Вы также можете установить его относительно окна просмотра: 

.sidebar-nav-fixed {
    left: 20px;
}

Однако эти подходы могут иметь нежелательные побочные эффекты для небольших экранов или мобильных макетов. Лучше использовать стандартный шаблон сетки макета.

...