Ломается сайт когда вставляю html код?

Question

[Антон Кудаев]

<div id="slider">
   <div class="slides">
      <!-- First slide --> 
      <div class="slider">
         <div class="legend"></div>
         <div class="content">
            <div class="content-txt">
               <h1> Онлайн видео-консультации </h1>
            </div>
         </div>
         <div class="images"> 
            <img src="https://tamc.pro/images/slider/1.jpg"> 
         </div>
      </div>
      <!-- Second slide --> 
      <div class="slider">
         <div class="legend"></div>
         <div class="content">
            <div class="content-txt">
               <h1> Лекарства в Израиле </h1>
            </div>
         </div>
         <div class="images"> 
            <img src="https://tamc.pro/images/slider/2.jpg"> 
         </div>
      </div>
      <!-- Third slide --> 
      <div class="slider">
         <div class="legend"></div>
         <div class="content">
            <div class="content-txt">
               <h1> Бесплатный перелет в Израиль </h1>
            </div>
         </div>
         <div class="images"> 
            <img src="https://tamc.pro/images/slider/3.jpg"> 
         </div>
      </div>
    </div>
</div>

Вставляю этот код и сайт переходит из нормального

вида в кошмар


Стили не пересекаются.

Answer 1

[Максим Тимофеев]

Ничего там не ломается. Просто Вы слайдер в шапку вставляете и у него высота больше чем у шапки, соответственно все двигается вниз, кроме меню, у которого явно фиксированное позиционирование с отступом сверху равному высоте старой шапки.

Answer 2

[Кемал Демирель]

Обнули отступы для h1 и еще было бы неплохо показать в какое именно место добавляешь + css свойства для этого участка.

Answer 3

[Владимир]

А поэтапно пробовал вставлять? Вставь сначала блок slider без содержимого, потом внутрь него следующий, и так до момента когда начнет ломаться.