Имеется слой shapka(на нем сверху еще три слоя): .shapka{ HEIGHT:176px; width: 940px; top: 30px; position: relative; margin:0 auto; background-color:#224179; } .risunka{position:relative; z-index:1; background-color:#224179; padding: 3px; float: left; height: 170px; } .zagolovok{ position:relative; top:-150; left:25; z-index:2; color:#FFFFFF; text-shadow: black 1px 1px 6px, red 0 0 50px; font-size:50px; float: left; /* Обтекание по правому краю */ width: 600px; text-align: right; } .registration{ padding: 5px; /* Поля вокруг текста */ width: 220px; float: right; position:relative; top:-150; z-index:3; right: 25; vertical-align: top; bottom: 0; } .clear { clear: both; /* Отмена обтекания */ } и слой content: .content{ width: 940px; position: relative; margin:0 auto; background-color:#ADDEE2; margin: auto; } html на странице: <div class="shapka"><div class="risunka"><IMG src="img/f_106286511.jpg" height="170"> <div class="zagolovok">Компания грузоперевозок «АВТОГРАНТ» </div></div> <div class="registration"> <table> </table></div> <div class="clear"></div> </div> <div class='content'>лалала</div> При выполнении этого кода верхний слой шапки находится постоянно на одном и том же месте при масштабировании вместе с верхними слоями, а контент уходит влево, меняется расстояние между шапкой и контентом. Выглядит так: как не надо Хотелось бы чтоб при масштабировании и вставленном тексте и картинках слои шапки и контента не меняли своего положения относительно друг друга и мыли склеены навечно. (пробовала уменьшить зазор с помощью top, но опять же меняется при масштабировании) как надо