Bootstrap и шапка фиксированной ширины

@nule · Регистрация: 03.11.2011

Студворк — интернет-сервис помощи студентам

Здравствуйте!
Только начал изучать bootstrap, запутался вот с какой штукой:
Есть картинка - шапка сайта, фиксированного размера. Никак не могу ограничить тело сайта шириной шапки. На большом экране ширина сайта больше ширины шапки. В идеале хотелось бы сделать так, чтобы макет был резиновым, но в пределах ширины шапки.
Спасибо!

@sheila · 23.01.2013, 19:32

У бутстрапа есть ограничения по размерам макета: 940px для макета фиксированной ширины и 1170px для адаптивного макета. Макет можно перекомпелировать здесь

Добавлено через 7 минут
как делать кастомизацию в less хорошо написано на хабре (см. ссылки в комментариях)

@nule · 25.01.2013, 13:33 **[ТС]**

Я ограничил body шириной шапки:

CSS
1
body {width: 895px; margin: 0 auto;}

Так же сделал с первым контейнером:

CSS
1
.container {width: 895px !important; }

Делаю два столбца span6 - они все равно получаются по 1170/2 и размещаются один под другим, а не в строчку. Как сделать, чтобы деление на колонки происходило для ширины 895, а не 1170?
Спасибо!

@sheila · 25.01.2013, 16:20

Дело в том, что изменился только размер body и основного контейнера. Размер же самих span остался прежним.

CSS
1
2
3
.span6 {
  width: 460px;
}

Два span в сумме дают 920px, не умещаются в размер body (895px) и поэтому падают один под другим. Чтобы поставить их рядом нужно span6 присвоить свой класс или идентификатор (лучше всего не в самом бутстрапе, а в своем style.css)

CSS
1
2
3
.span6 {
  width: 447px;
}

или задать ширину в процентах
но лучше все-таки перекомпилировать в less, чтобы каждый раз не переписывать фреймворк вручную.

@nule · 25.01.2013, 16:40 **[ТС]**

Я надеялся, что сетка формируется container и наследует его ширину.
У меня помимо span6 будут еще span3 и 4. Выходит, так и придется всем ширину руками задавать? Как-то теряется удобство фреймверка в этой конкретной ситуации.

@sheila · 25.01.2013, 17:59

в том то и дело.. на хабре по ссылке (см. в первом посте) обсуждался в комментах этот вопрос. Пришли к выводу, что затрагивать ядро фреймворка нет смысла, лучше либо поискать новый под свои нужды, либо написать с нуля. У каждого практически есть свой фреймворк, ими и пользуются...Сейчас сетка 960px считается устаревшей, заказывают сайты от 1120px чаще всего, не знаю, есть ли фреймворки меньше 960px по ширине.. Можно еще рассмотреть эту сетку, может быть она покажется вам удобнее.

@nule · 25.01.2013, 18:18 **[ТС]**

Ясно, спасибо. Тут у меня нестандартный случай. Обязательное условие - именно эта шапка.

@sheila · 25.01.2013, 18:25

ну..если в фотошопе никак нельзя ее дорисовать до нужной ширины, тогда ничего не поделаешь..
width: 447px, наверное, нужно сделать меньше с расчетом на маржины

Новые блоги и статьи Все статьи Все блоги /
Модель заражения группы наркоманов alhaos 17.04.2026 Условия задачи сформулированы тут Суть: - Группа наркоманов из 10 человек. - Только один инфицирован ВИЧ. - Колются одной иглой. - Колются раз в день. - Колются последовательно через. . .	Мысли в слух. Про "навсегда". kumehtar 16.04.2026 Подумалось тут, что наверное очень глупо использовать во всяких своих установках понятие "навсегда". Это очень сильное понятие, и я только начинаю понимать край его смысла, не смотря на то что давно. . .	My Business CRM MaGz GoLd 16.04.2026 Всем привет, недавно возникла потребность создать CRM, для личных нужд. Собственно программа предоставляет из себя базу данных клиентов, в которой можно фиксировать звонки, стадии сделки, а также. . .	Знаешь почему 90% людей редко бывают счастливыми? kumehtar 14.04.2026 Потому что они ждут. Ждут выходных, ждут отпуска, ждут удачного момента. . . а удачный момент так и не приходит.
Фиксация колонок в отчете СКД Maks 14.04.2026 Фиксация колонок в СКД отчета типа Таблица. Задача: зафиксировать три левых колонки в отчете. Процедура ПриКомпоновкеРезультата(ДокументРезультат, ДанныеРасшифровки, СтандартнаяОбработка) / / . . .	Настройки VS Code Loafer 13.04.2026 { "cmake. configureOnOpen": false, "diffEditor. ignoreTrimWhitespace": true, "editor. guides. bracketPairs": "active", "extensions. ignoreRecommendations": true, . . .	Оптимизация кода на разграничение прав доступа к элементам формы Maks 13.04.2026 Алгоритм из решения ниже реализован на нетиповом документе, разработанного в конфигурации КА2. Задачи, как таковой, поставлено не было, проделанное ниже исключительно моя инициатива. Было так:. . .	Контроль заполнения и очистка дат в зависимости от значения перечислений Maks 12.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: реализовать контроль корректности заполнения дат назначения. . .

@nule 0 / 0 / 0 Регистрация: 03.11.2011 Сообщений: 66

	Bootstrap и шапка фиксированной ширины 23.01.2013, 16:33. Показов 6965. Ответов 7 Метки нет (Все метки) Здравствуйте! Только начал изучать bootstrap, запутался вот с какой штукой: Есть картинка - шапка сайта, фиксированного размера. Никак не могу ограничить тело сайта шириной шапки. На большом экране ширина сайта больше ширины шапки. В идеале хотелось бы сделать так, чтобы макет был резиновым, но в пределах ширины шапки. Спасибо! 0

@sheila 47 / 47 / 6 Регистрация: 10.05.2012 Сообщений: 236
	23.01.2013, 19:32
	У бутстрапа есть ограничения по размерам макета: 940px для макета фиксированной ширины и 1170px для адаптивного макета. Макет можно перекомпелировать здесь Добавлено через 7 минут как делать кастомизацию в less хорошо написано на хабре (см. ссылки в комментариях) 1

@nule 0 / 0 / 0 Регистрация: 03.11.2011 Сообщений: 66
	25.01.2013, 16:40 [ТС]
	Я надеялся, что сетка формируется container и наследует его ширину. У меня помимо span6 будут еще span3 и 4. Выходит, так и придется всем ширину руками задавать? Как-то теряется удобство фреймверка в этой конкретной ситуации. 0

@sheila 47 / 47 / 6 Регистрация: 10.05.2012 Сообщений: 236
	25.01.2013, 17:59
	в том то и дело.. на хабре по ссылке (см. в первом посте) обсуждался в комментах этот вопрос. Пришли к выводу, что затрагивать ядро фреймворка нет смысла, лучше либо поискать новый под свои нужды, либо написать с нуля. У каждого практически есть свой фреймворк, ими и пользуются...Сейчас сетка 960px считается устаревшей, заказывают сайты от 1120px чаще всего, не знаю, есть ли фреймворки меньше 960px по ширине.. Можно еще рассмотреть эту сетку, может быть она покажется вам удобнее. 1

@nule 0 / 0 / 0 Регистрация: 03.11.2011 Сообщений: 66
	25.01.2013, 18:18 [ТС]
	Ясно, спасибо. Тут у меня нестандартный случай. Обязательное условие - именно эта шапка. 0

@sheila 47 / 47 / 6 Регистрация: 10.05.2012 Сообщений: 236
	25.01.2013, 18:25
	ну..если в фотошопе никак нельзя ее дорисовать до нужной ширины, тогда ничего не поделаешь.. width: 447px, наверное, нужно сделать меньше с расчетом на маржины 0