2013-03-25 1 views
0

Я использую класс .container в своем навигаторе, на теле и нижнем колонтитуле.Как увеличить ширину контейнера в Twitter Загрузочный бокс

Итак, все три хорошо расположены слева. Тем не менее, я хотел бы увеличить ширину класса container.

По умолчанию ширина приходит в 1170 году:

media="screen, projection" 
bundle-bundle_bootstrap_head.css:[email protected] (min-width: 1200px) 
.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { 
width: 1170px; 
} 

Однако, я хотел бы расширить ширину 1300. Таким образом, я добавил следующее в моем main.css

.container { 
    width: 1200px; 
} 

Но это Безразлично Кажется, он работает. Когда я перезагружаю страницу и просматриваю CSS, 1200 вычеркивается, а 1170 все еще активен.

Вопрос

Как я могу продлить ширину по умолчанию container класса в начальной загрузки?

+2

Попробуйте добавить! Важно после вашего утверждения ширины, поэтому он становится: 'width: 1200px! Important;' –

+0

, который работал благодаря – Anthony

+1

@StefanCandan, это очень плохая практика. Вы должны очень редко использовать это –

ответ

0

Попробуйте

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

.container { 
    width: 1200px !important; 
} 

Проверить this для получения дополнительной информации.

В этом случае важно! Можно использовать в качестве работы вокруг, но используя это свойство рассматривается как плохая практика, и не рекомендуется специалистами CSS.

+0

Это плохая практика, которой следует избегать любой ценой –

+0

@CodyGuldner Спасибо за информацию, я обновил свой ответ. – ssilas777

+0

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

1

Возможно, вы загрузили main.css (bootstrap.css) и внесите изменения. Тогда вы, вероятно, звоните bootstrap-responsive.css после этого и перезаписываете свои изменения.

Ширина 1170px .container происходит из файла bootstrap-responsive.css. Это ширина, назначенная по умолчанию для экранов больших экранов (1200 пикселей и шире). Вот почему я предполагаю, что вы вызываете bootstrap-responsive.css после вашего файла main.css.

Использование !important - это анти-шаблон (плохая практика) в этом отношении. Особенно на что-то общее, как ваш .container. Это приведет к проблемам специфики в будущем. Я призываю вас исправить и понять проблему, а не «взломать ее».

0

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

Как установить ширину контейнера, вы также должны установить свойство max-width для вашего css.

container 
{ 
    width:1200px; 
    max-width:1200px; 
} 

Как уже отмечалось выше, убедитесь, чтобы загрузить свой собственный CSS после файла bootstrap.css поэтому настройки повторно объявлены.

Смежные вопросы