Покосившаяся верстка
Сделал согласно Отображение меню (см. также Копирование шаблона из меню), а именно вторым аргументом поставил slider_index. В результате во всех проектах в OpenServer кнопка "Обратный звонок" переместилась на следующую строку, а также в Лучших товарах, Преимуществах, Публикациях и т. д. последняя карточка сместилась на следующую строку.
Затем убрал полностью компонент news.list (имя шаблона slider_index которого добавил), но в результате верстка все равно осталась сдвинутой.
Прилагаю код хедера
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- <meta name="viewport" content="width=device-width, initial-scale=1"> -->
<title><?$APPLICATION->ShowTitle();?></title>
<?$APPLICATION->ShowHead();?>
<?$APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH."/css/screen.css");?>
<?$APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH."/font/font.css");?>
<?$APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH."/css/jquery.fancybox.css");?>
<?$APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH."/css/jquery.bxslider.css");?>
<?$APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH."/css/jquery.formstyler.css");?>
<?$APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH."/css/jquery.formstyler.theme.css");?>
<?$APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH."/js/jquery-3.1.1.min.js");?>
<?$APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH."/js/jquery.fancybox.min.js");?>
<?$APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH."/js/jquery.bxslider.min.js");?>
<?$APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH."/js/jquery.formstyler.min.js");?>
<?$APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH."/js/main.js");?>
<?$isIndex = $APPLICATION->GetCurPage() == SITE_DIR; ?>
</head>
<body>
<div id="panel"><?$APPLICATION->ShowPanel();?></div>
<header>
<?echo $isIndex;?>
<div class="top_head_white_bl">
<div class="standart_width">
<div class="top_head_logo">
<?$APPLICATION->IncludeComponent(
"bitrix:main.include",
"",
Array(
"AREA_FILE_SHOW" => "file",
"AREA_FILE_SUFFIX" => "inc",
"EDIT_TEMPLATE" => "",
"PATH" => "/include/inc_logo.php"
)
);?>
</div>
<div class="header_menu_bl">
<?$APPLICATION->IncludeComponent("bitrix:menu", "header", Array(
"ALLOW_MULTI_SELECT" => "N", // Разрешить несколько активных пунктов одновременно
"CHILD_MENU_TYPE" => "left", // Тип меню для остальных уровней
"DELAY" => "N", // Откладывать выполнение шаблона меню
"MAX_LEVEL" => "3", // Уровень вложенности меню
"MENU_CACHE_GET_VARS" => "", // Значимые переменные запроса
"MENU_CACHE_TIME" => "3600", // Время кеширования (сек.)
"MENU_CACHE_TYPE" => "A", // Тип кеширования
"MENU_CACHE_USE_GROUPS" => "Y", // Учитывать права доступа
"ROOT_MENU_TYPE" => "top", // Тип меню для первого уровня
"USE_EXT" => "Y", // Подключать файлы с именами вида .тип_меню.menu_ext.php
"COMPONENT_TEMPLATE" => "horizontal_multilevel"
),
false
);?>
</div>
<div class="top_head_favor_bl">
<div class="top_head_favor">
<a href="">Избранное</a><span>10</span>
</div>
</div>
<div class="top_head_bt">
<a class="gray_bt" data-fancybox data-src="#call_back" href="javascript:;">
<?$APPLICATION->IncludeComponent(
"bitrix:main.include",
"",
Array(
"AREA_FILE_SHOW" => "file",
"AREA_FILE_SUFFIX" => "inc",
"EDIT_TEMPLATE" => "",
"PATH" => "/include/inc_callback.php"
)
);?>
</a>
</div>
</div>
</div>
<?if($isIndex):?>
<div class="index_slider_bl">
<ul class="index_slider">
<li>
<div class="index_slider_el" style="background-image:url(<?=SITE_TEMPLATE_PATH?>/img/index_slider_bg.png);">
<div class="standart_width index_slider_cont">
<div class="ind_slid_txt_bl">
<div class="ind_slid_tit">Современный монстр.</div>
<div class="ind_slid_txt">В своем стремлении повысить качество жизни, они забывают, что синтетическое тестирование требует анализа форм воздействия. Идейные соображения высшего порядка, а также социально-экономическое развитие создает предпосылки для как самодостаточных, так и внешне зависимых концептуальных решений!</div>
<a class="blue_bt" href="">Узнать подробнее</a>
</div>
<div class="ind_slid_img"><img src="<?=SITE_TEMPLATE_PATH?>/img/index_slider1.png" alt=""/></div>
</div>
</div>
</li>
<li>
<div class="index_slider_el" style="background-image:url(<?=SITE_TEMPLATE_PATH?>/img/index_slider_bg.png);">
<div class="standart_width index_slider_cont">
<div class="ind_slid_txt_bl">
<div class="ind_slid_tit">Осенний ценопад</div>
<div class="ind_slid_txt">Перспективное планирование способствует повышению качества поставленных обществом задач. В частности, синтетическое тестирование прекрасно подходит для реализации стандартных подходов.</div>
<a class="blue_bt" href="">Узнать подробнее</a>
</div>
<div class="ind_slid_img"><img src="<?=SITE_TEMPLATE_PATH?>/img/index_slider1.png" alt=""/></div>
</div>
</div>
</li>
</ul>
</div>
<div class="gray_head_info_bl">
<div class="standart_width clear_after">
<div class="mouse_bl"><img src="<?=SITE_TEMPLATE_PATH?>/img/mouse.png" alt=""/></div>
<div class="head_search_bl">
<form>
<input type="text" placeholder="Поиск товаров и услуг"/>
<input type="submit" value="найти"/>
</form>
</div>
</div>
</div>
<?endif?>
</header>
<?if(!$isIndex):?>
<section>
<div class="bread_crumbs_bl">
<div class="standart_width">
<ul class="bread_crumbs not_style">
<?$APPLICATION->IncludeComponent("bitrix:breadcrumb", "navchain", Array(
"PATH" => "", // Путь, для которого будет построена навигационная цепочка (по умолчанию, текущий путь)
"SITE_ID" => "s1", // Cайт (устанавливается в случае многосайтовой версии, когда DOCUMENT_ROOT у сайтов разный)
"START_FROM" => "0", // Номер пункта, начиная с которого будет построена навигационная цепочка
),
false
);?>
</ul>
</div>
</div>
</section>
<?endif;?>Но что удивительно покосилась верстка в других проектах (внутри папки C:\OpenServer\domains) без битрикса, а именно такой код
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- <meta name="viewport" content="width=device-width, initial-scale=1"> -->
<title>Главная</title>
<link href="./css/screen.css" rel="stylesheet" type="text/css" >
<link href="./font/font.css" rel="stylesheet" type="text/css" >
<link href="./css/jquery.fancybox.css" rel="stylesheet" type="text/css" >
<link href="./css/jquery.bxslider.css" rel="stylesheet" type="text/css" >
<link href="./css/jquery.formstyler.css" rel="stylesheet" type="text/css" >
<link href="./css/jquery.formstyler.theme.css" rel="stylesheet" type="text/css" >
<script type="text/javascript" src="./js/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="./js/jquery.fancybox.min.js"></script>
<script type="text/javascript" src="./js/jquery.bxslider.min.js"></script>
<script type="text/javascript" src="./js/jquery.formstyler.min.js"></script>
<script type="text/javascript" src="./js/main.js"></script>
</head>
<body>
<header>
<div class="top_head_white_bl">
<div class="standart_width">
<div class="top_head_logo"><a href="/"><img src="./img/logo.png" alt=""/></a></div>
<div class="header_menu_bl">
<div class="header_menu">
<div>
<a class="menu_lvl1_bt arrow active" href=""><span>Каталог</span></a>
<div class="menu_lvl2">
<div>
<a class="menu_lvl2_bt arrow active" href="">Компьютеры и ноутбуки</a>
<div class="menu_lvl3">
<a href="">Компьютеры</a>
<a class="active" href="">Ноутбуки</a>
</div>
</div>
<div>
<a class="menu_lvl2_bt arrow" href="">Телевизоры, Видео, Аудио</a>
<div class="menu_lvl3">
<a href="">Телевизоры</a>
<a href="">Видео</a>
<a href="">Аудио</a>
</div>
</div>
<div>
<a class="menu_lvl2_bt arrow" href="">Товары для дома</a>
<div class="menu_lvl3">
<a href="">Пылесосы</a>
<a href="">Утюги</a>
<a href="">Швейные машины</a>
</div>
</div>
<div>
<a class="menu_lvl2_bt arrow" href="">Товары для кухни</a>
<div class="menu_lvl3">
<a href="">Микроволновые печи</a>
<a href="">Мультиварки</a>
<a href="">Пароварки</a>
<a href="">Хлебопечки</a>
</div>
</div>
</div>
</div>
<div><a class="menu_lvl1_bt" href=""><span>Акции</span></a></div>
<div><a class="menu_lvl1_bt" href=""><span>Доставка</span></a></div>
<div><a class="menu_lvl1_bt" href=""><span>О компании</span></a></div>
<div><a class="menu_lvl1_bt" href=""><span>Новости</span></a></div>
<div><a class="menu_lvl1_bt" href=""><span>Контакты</span></a></div>
</div>
</div>
<div class="top_head_favor_bl">
<div class="top_head_favor">
<a href="">Избранное</a><span>10</span>
</div>
</div>
<div class="top_head_bt"><a class="gray_bt" data-fancybox data-src="#call_back" href="javascript:;">Обратный звонок</a></div>
</div>
</div>
<div class="index_slider_bl">
<ul class="index_slider">
<li>
<div class="index_slider_el" style="background-image:url(./img/index_slider_bg.png);">
<div class="standart_width index_slider_cont">
<div class="ind_slid_txt_bl">
<div class="ind_slid_tit">Современный монстр.</div>
<div class="ind_slid_txt">В своем стремлении повысить качество жизни, они забывают, что синтетическое тестирование требует анализа форм воздействия. Идейные соображения высшего порядка, а также социально-экономическое развитие создает предпосылки для как самодостаточных, так и внешне зависимых концептуальных решений!</div>
<a class="blue_bt" href="">Узнать подробнее</a>
</div>
<div class="ind_slid_img"><img src="./img/index_slider1.png" alt=""/></div>
</div>
</div>
</li>
<li>
<div class="index_slider_el" style="background-image:url(./img/index_slider_bg.png);">
<div class="standart_width index_slider_cont">
<div class="ind_slid_txt_bl">
<div class="ind_slid_tit">Осенний ценопад</div>
<div class="ind_slid_txt">Перспективное планирование способствует повышению качества поставленных обществом задач. В частности, синтетическое тестирование прекрасно подходит для реализации стандартных подходов.</div>
<a class="blue_bt" href="">Узнать подробнее</a>
</div>
<div class="ind_slid_img"><img src="./img/index_slider1.png" alt=""/></div>
</div>
</div>
</li>
</ul>
</div>
<div class="gray_head_info_bl">
<div class="standart_width clear_after">
<div class="mouse_bl"><img src="./img/mouse.png" alt=""/></div>
<div class="head_search_bl">
<form>
<input type="text" placeholder="Поиск товаров и услуг"/>
<input type="submit" value="найти"/>
</form>
</div>
</div>
</div>
</header>
<section>
<div class="gray_bg">
<div class="standart_width">
<div class="title">Лучшие товары</div>
<div class="all_catalog_bl">
<a class="all_catalog_bt" href="">Каталог товаров</a>
</div>
<div class="catalog_list">
<div class="catalog_el">
<div class="cat_el_img">
<a href=""><img src="./img/produce1.png" alt=""/></a>
<div class="cat_el_status">
<div class="red">акция</div>
<div class="green">новинка</div>
<div class="blue">хит</div>
</div>
</div>
<div class="cat_el_star">
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_gray.png" alt=""/>
</div>
<div class="cat_el_name">
<div class="cat_el_tit"><a href="">Стиральная машина QuickDrive WW6850N</a></div>
</div>
<div class="cat_el_price">
<div class="cat_el_price_t_c">
<div class="cat_old_price">
<div class="price">39 999 р.</div>
<div class="sale">-10%</div>
</div>
<div class="cat_price">36 000 р.</div>
</div>
</div>
<a class="favor_bt" href="">В избранное</a>
</div>
<div class="catalog_el">
<div class="cat_el_img">
<a href=""><img src="./img/produce1.png" alt=""/></a>
</div>
<div class="cat_el_star">
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_gray.png" alt=""/>
</div>
<div class="cat_el_name">
<div class="cat_el_tit"><a href="">Стиральная машина QuickDrive WW6850N</a></div>
</div>
<div class="cat_el_price">
<div class="cat_el_price_t_c">
<div class="cat_old_price">
<div class="price">39 999 р.</div>
<div class="sale">-10%</div>
</div>
<div class="cat_price">36 000 р.</div>
</div>
</div>
<a class="favor_bt active" href="">В избранное</a>
</div>
<div class="catalog_el">
<div class="cat_el_img">
<a href=""><img src="./img/produce1.png" alt=""/></a>
</div>
<div class="cat_el_star">
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_gray.png" alt=""/>
</div>
<div class="cat_el_name">
<div class="cat_el_tit"><a href="">Стиральная машина QuickDrive WW6850N</a></div>
</div>
<div class="cat_el_price">
<div class="cat_el_price_t_c">
<div class="cat_old_price">
<div class="price">39 999 р.</div>
<div class="sale">-10%</div>
</div>
<div class="cat_price">36 000 р.</div>
</div>
</div>
<a class="favor_bt" href="">В избранное</a>
</div>
<div class="catalog_el">
<div class="cat_el_img">
<a href=""><img src="./img/produce1.png" alt=""/></a>
</div>
<div class="cat_el_star">
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_orange.png" alt=""/>
<img src="./img/star_gray.png" alt=""/>
</div>
<div class="cat_el_name">
<div class="cat_el_tit"><a href="">Стиральная машина QuickDrive WW6850N</a></div>
</div>
<div class="cat_el_price">
<div class="cat_el_price_t_c">
<div class="cat_old_price">
<div class="price">39 999 р.</div>
<div class="sale">-10%</div>
</div>
<div class="cat_price">36 000 р.</div>
</div>
</div>
<a class="favor_bt" href="">В избранное</a>
</div>
</div>
</div>
</div>
<div class="white_bg">
<div class="standart_width">
<div class="title">Акции</div>
<div class="all_catalog_bl">
<a class="all_catalog_bt" href="">Все акции</a>
</div>
<div class="action_list">
<a class="action_el" href="">
<span class="action_el_img"><img src="./img/action1.png" alt=""/></span>
<span class="action_el_cont">Базовый вектор развития создает предпосылки для первоочередных требований.</span>
</a>
<a class="action_el" href="">
<span class="action_el_img"><img src="./img/action2.png" alt=""/></span>
<span class="action_el_cont">Независимые государства объединены в целые кластеры себе подобных.</span>
</a>
<a class="action_el" href="">
<span class="action_el_img"><img src="./img/action3.png" alt=""/></span>
<span class="action_el_cont">Базовый вектор развития создает предпосылки для первоочередных требований.</span>
</a>
</div>
</div>
</div>
<div class="about_bl">
<div class="about_txt_bl">
<div class="about_txt">
<div class="title">О компании</div>
<p>Повседневная практика показывает, что реализация намеченных плановых заданий обеспечивает актуальность соответствующих условий активизации.</p>
<p>Предварительные выводы неутешительны: существующая теория однозначно фиксирует необходимость поэтапного и последовательного развития общества.
В частности, курс на социально-ориентированный национальный проект способствует подготовке и реализации системы обучения кадров, соответствующей насущным потребностям.</p>
<a class="blue_bt" href="">Узнать больше</a>
</div>
</div>
<div class="about_img">
<img src="./img/about.png" alt=""/>
</div>
</div>
<div class="advantage_bl">
<div class="standart_width">
<div class="title">Преимущества</div>
<div class="advantage_list">
<div class="advantage_el">
<div class="advantage_img"><img src="./img/advantage1.png" alt=""/></div>
<div class="advantage_tit">Лучшее качество</div>
<div class="advantage_txt">А также реплицированные с зарубежных источников, современные исследования могут быть объединены в целые кластеры себе подобных.</div>
</div>
<div class="advantage_el">
<div class="advantage_img"><img src="./img/advantage2.png" alt=""/></div>
<div class="advantage_tit">Доставка вовремя</div>
<div class="advantage_txt">Ясность нашей позиции очевидна: сплоченность команды профессионалов способствует подготовке и реализации новых предложений!</div>
</div>
<div class="advantage_el">
<div class="advantage_img"><img src="./img/advantage3.png" alt=""/></div>
<div class="advantage_tit">Поддержка 24/7 </div>
<div class="advantage_txt">Значимость этих проблем настолько очевидна, что экономическая повестка сегодняшнего дня создает предпосылки для анализа существующих паттернов поведения.</div>
</div>
<div class="advantage_el">
<div class="advantage_img"><img src="./img/advantage4.png" alt=""/></div>
<div class="advantage_tit">Гарантия на товары</div>
<div class="advantage_txt">Прежде всего, реализация намеченных плановых заданий позволяет выполнить важные задания по разработке укрепления моральных ценностей.</div>
</div>
</div>
</div>
</div>
<div class="gray_bg">
<div class="standart_width">
<div class="title">Публикации</div>
<div class="all_catalog_bl">
<a class="all_catalog_bt" href="">Все публикации</a>
</div>
<div class="news_list">
<div class="news_el">
<div class="news_el_img">
<a href=""><img src="./img/news1.png" alt=""/></a>
<div class="news_el_data">11 октября 2018</div>
</div>
<div class="news_el_cont">
<div class="news_el_tit"><a href="">Как выбрать стиральную машину?</a></div>
<div class="news_el_txt">С учетом сложившейся международной обстановки, разбавленное изрядной долей эмпатии, рациональное мышление предоставляет широкие возможности для поэтапного и последовательного развития.</div>
</div>
</div>
<div class="news_el">
<div class="news_el_img">
<a href=""><img src="./img/news2.png" alt=""/></a>
<div class="news_el_data">12 октября 2018</div>
</div>
<div class="news_el_cont">
<div class="news_el_tit"><a href="">Превозмогая сложившуюся непростую экономическую ситуацию</a></div>
<div class="news_el_txt">Повседневная практика показывает, что высокотехнологичная концепция общественного уклада не оставляет шанса для как самодостаточных, так и внешне</div>
</div>
</div>
<div class="news_el">
<div class="news_el_img">
<a href=""><img src="./img/news3.png" alt=""/></a>
<div class="news_el_data">13 октября 2018</div>
</div>
<div class="news_el_cont">
<div class="news_el_tit"><a href="">Как выбрать стиральную машину?</a></div>
<div class="news_el_txt">С учетом сложившейся международной обстановки, разбавленное изрядной долей эмпатии, рациональное мышление предоставляет широкие возможности для поэтапного и последовательного развития.</div>
</div>
</div>
<div class="news_el">
<div class="news_el_img">
<a href=""><img src="./img/news4.png" alt=""/></a>
<div class="news_el_data">14 октября 2018</div>
</div>
<div class="news_el_cont">
<div class="news_el_tit"><a href="">Превозмогая сложившуюся непростую экономическую ситуацию</a></div>
<div class="news_el_txt">Повседневная практика показывает, что высокотехнологичная концепция общественного уклада не оставляет шанса для как самодостаточных, так и внешне</div>
</div>
</div>
</div>
</div>
</div>
</section>
<footer>
<div class="foot_info_bl">
<div class="standart_width">
<div class="top_head_logo"><a href="/"><img src="./img/logo.png" alt=""/></a></div>
<div class="foot_menu">
<ul>
<li><a href="">Каталог</a></li>
<li><a href="">Акции</a></li>
<li><a href="">Доставка</a></li>
<li><a href="">О компании</a></li>
<li><a href="">Новости</a></li>
<li><a href="">Контакты</a></li>
</ul>
</div>
<div class="foot_tel">
<a href="tel:+79003002010">8 (900) 300-20-10</a>
<span>с 8:00 до 20:00 (Мск)</span>
</div>
<div class="top_head_bt">
<a class="gray_bt" data-fancybox data-src="#call_back" href="javascript:;">Обратный звонок</a>
</div>
</div>
</div>
<div class="foot_prava_bl">
<div class="standart_width">
<div class="position_relative">
<div class="foot_prava">Copyright © 2018 Salavey.net Разработка, реализация и развитие e-commerce проектов на 1С-Битрикс.</div>
<a class="foot_salavey" href=""><img src="./img/salavey.png" alt=""/></a>
</div>
</div>
</div>
</footer>
<div class="popup" id="call_back" style="display:none;">
<form>
<div class="popup_tit">Обратный звонок</div>
<div class="popup_form">
<input type="text" placeholder="Ваше имя"/>
</div>
<div class="popup_form">
<input class="error" type="email" placeholder="Email"/>
</div>
<div class="popup_form">
<input class="true" type="tel" placeholder="Телефон"/>
</div>
<div class="popup_form">
<textarea placeholder="Вопрос или сообщение"></textarea>
</div>
<div class="popup_form prava styler">
<label>
<input type="checkbox"/>
<span>Я принимаю <a href="">условия передачи данных</a></span>
</label>
</div>
<div>
<a class="green_bt" href="">Отправить</a>
</div>
</form>
</div>
</body>
</html>