Как убрать резиновую шапку на сайте

@djzik1 · Регистрация: 09.04.2017

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

[CENTER]Здравствуйте! Скачал шаблон, а шапка в данном шаблоне резиновая и вылезает за края.
Скажите как сделать её не резиновой и что бы она была одинакового размера с нижним блоком!
Прощу помощи!!! p.s я новичок и много не знаю еще, движок wordpress, сайт: https://goo. gl/JMJNmY (убрать пробел)

@mrtoxas · 09.04.2017, 10:25

Оберните контейнером .container все блоки, которые не должны быть на всю ширину экрана. Например:

HTML5
1
2
3
4
5
<header>
    <div class="container">
        <!-- Контент header'а -->
    </div>
</header>

Этот контейнер задает размер max-width: 1140px;

@djzik1 · 09.04.2017, 17:41 **[ТС]**

Я очень плохо разбираюсь в css, можете зайти ко мне на сайт и сказать что именно я должен обернуть, и как указать размер контейнера.

@mrtoxas · 09.04.2017, 18:23

Это HTML. В css у вас уже готово. Откройте исходный код страницы и посмотрите. Основной контент страницы у вас не растянут на весь экран потому, что он обернут в блок <div class="container">
Возьмем структуру черной полоски, которая в header'е:

HTML5
1
2
3
4
5
6
7
8
9
10
<div class="top-header">
  <div class="container">
    <div class="vce-wrap-left">
      <!-- Контент -->
    </div>
    <div class="vce-wrap-right">
      <!-- Контент -->
    </div>
  </div>
</div>

Весь контент, который не должен быть растянут на весь экран, обернут в <div class="container">. Если этот контейнер убрать, то все блоки, которые были в нем, расползутся на весь экран.
Вот вам для наглядности пример:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html lang="en">
 
<head>
  <meta charset="UTF-8" />
  <title>Document</title>
  <style>
    .container {
      margin: 0 auto;
      max-width: 1140px;
    }
  </style>
</head>
 
<body>
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolores velit consequuntur quia quibusdam corrupti laboriosam, quos harum. Deleniti modi, ex quisquam, officiis fuga magnam aliquam suscipit dolor, impedit mollitia expedita.
  <div class="container">
    Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Прямо рукописи живет его одна приставка! Одна, приставка семантика ipsum над они, переписывается о если, рекламных ее залетают свой взобравшись!
  </div>
</body>
 
</html>

http://codepen.io/anon/pen/PpMPKa

В общем, чтобы сделать то, что вы хотите, вам надо править HTML-код страницы, а именно, завернуть ваш header в container. И должна у вас получиться такая структура:

HTML5
1
2
3
4
<div id="vce-main">
   <div class="container">
     <header id="header" class="main-header">
         <!-- Контент -->

@djzik1 · 10.04.2017, 00:45 **[ТС]**

Огромное вам спасибо! Радость мою не передать словами! Знание это сила!!!

Добавлено через 1 час 13 минут
С этим разобрался, а вот со слайдами не могу найти в каком файле. где написано hello world

Добавлено через 43 минуты
Вроде бы нашел код, но при обертке картинки пропадают, а стрелки переключения слайдов остаются на своем месте. Скорее всего я не правильно что то делаю. Код был в файле featured-full.php. При удалении кода, слад бар пропадает.

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<div class="vce-featured">
    <div class="vce-featured-header">
        <div class="vce-featured-info">
            <div class="vce-hover-effect">
 
                <?php if ( vce_get_option( 'lay_fa_big_cat' ) ) : ?>
                    <div class="vce-featured-section">
                        <?php echo vce_get_category(); ?>
                    </div>
                <?php endif; ?>
 
                <h2 class="vce-featured-title">
                    <a class="vce-featured-link-article" href="<?php echo esc_url(get_permalink()); ?>" title="<?php echo esc_attr(get_the_title()); ?>"><?php the_title(); ?></a>        
                </h2>
 
                <?php if ( $meta = vce_get_meta_data( 'lay-fa-big' ) ) : ?>
                    <div class="entry-meta"><?php echo $meta; ?></div>
                <?php endif; ?>
 
            </div>
        </div>
        
        <a href="<?php echo esc_url(get_permalink()); ?>" class="vce-featured-header-background"></a>
    </div>
 
 
    <?php if($fimage = vce_featured_image('vce-fa-full')): ?>         
            <a href="<?php echo esc_url(get_permalink()); ?>" title="<?php echo esc_attr(get_the_title()); ?>">
                <?php echo $fimage; ?>
            </a>
    <?php endif; ?> 
 
 
</div>

Новые блоги и статьи Все статьи Все блоги /
Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .	SDL3 для Web (WebAssembly): Работа со звуком через SDL3_mixer 8Observer8 08.02.2026 Содержание блога Пошагово создадим проект для загрузки звукового файла и воспроизведения звука с помощью библиотеки SDL3_mixer. Звук будет воспроизводиться по клику мышки по холсту на Desktop и по. . .

@djzik1 0 / 0 / 0 Регистрация: 09.04.2017 Сообщений: 7

	Как убрать резиновую шапку на сайте 09.04.2017, 06:12. Показов 2100. Ответов 4 Метки нет (Все метки) [CENTER]Здравствуйте! Скачал шаблон, а шапка в данном шаблоне резиновая и вылезает за края. Скажите как сделать её не резиновой и что бы она была одинакового размера с нижним блоком! Прощу помощи!!! p.s я новичок и много не знаю еще, движок wordpress, сайт: https://goo. gl/JMJNmY (убрать пробел) Миниатюры 0

@djzik1 0 / 0 / 0 Регистрация: 09.04.2017 Сообщений: 7
	09.04.2017, 17:41 [ТС]
	Я очень плохо разбираюсь в css, можете зайти ко мне на сайт и сказать что именно я должен обернуть, и как указать размер контейнера. 0

Как убрать резиновую шапку на сайте

Решение