Перейти к содержанию
IrinaAntonenko

Как выровнять меню по ширине

Рекомендуемые сообщения

Блок меню и контента имеют разную ширину.

Как изменить css чтобы они были одинаковой ширины?

#menu {
    background-color: #252424;
    background-image: linear-gradient(to bottom, #23a1d1, #1f90bb);
    background-repeat: repeat-x;
    border-color: #252424 #252424 #252424;
    min-height: 40px;
        
}
#menu .nav > li > a {
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    padding: 10px 15px 10px 15px;
    min-height: 15px;
    background-color: transparent;
    }

Без имени-1.jpg

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Нужна ссылка на сайт

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Если есть лишний row на странице, что ниже крошек, то удалите, должно сузиться в две стороны по 15px

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Это не лишний .row, это стандартная разметка страницы

Эффект проявляется при задании цвета фона для блоков body и #content

Навскидку:

.container> .breadcrumb + .row {

margin-left: 0;

margin-right: 0;

}

тем самым просто "убиваем" стили блока div.row, следующего непосредственно за Хлебными крошками

На малых экранах будут одинаковые поля по 15 пикселей слева и справа.

Изменено пользователем jaffagold

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
В 02.08.2017 в 10:27, jaffagold сказал:

Это не лишний .row, это стандартная разметка страницы

Эффект проявляется при задании цвета фона для блоков body и #content

Навскидку:

.container> .breadcrumb + .row {

margin-left: 0;

margin-right: 0;

}

тем самым просто "убиваем" стили блока div.row, следующего непосредственно за Хлебными крошками

На малых экранах будут одинаковые поля по 15 пикселей слева и справа.

спасибо! это решение помогло. но остался один нюанс. на главной странице размер поля контент осталось шире чем меню. как это решить?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

.common-home .container + .container> .row {

margin: 0;

}

сужает границы контента

можно сделать общим блоком

 

.container> .breadcrumb + .row,

.common-home .container + .container > .row {

margin-left: 0;

margin-right: 0;

}

Изменено пользователем jaffagold

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
1 час назад, jaffagold сказал:

.common-home .container + .container> .row {

margin: 0;

}

сужает границы контента

можно сделать общим блоком

 

.container> .breadcrumb + .row,

.common-home .container + .container > .row {

margin-left: 0;

margin-right: 0;

}

А значит row лишний.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Это стандартный row стандартного шаблона.

Завтра захочется вернуться к обычному виду- достаточно удалить пару стилей, а не лезть в tpl, вспоминать, что и где выпиливали.

Изменено пользователем jaffagold

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.