Резиновый блок не работает

html css веб дизайн верстка

У меня встала задача сделать спойлер с резиновыми и фиксированными элементами. По углам фиксированные графические элементы (уголки), а вся центральная часть должна растягиваться по высоте. В сложенном состоянии это выглядит так: http://i018.radikal.ru/1107/c6/a8fd4ca11206.png Соответственно когда открывается - все должно вытягиваться в прямоугольный блок с углами. Так вот, у меня почему-то растягивается только центр, а по бокам углы остаются сложенными...

CSS:
.block1,.block2 {
width:946px;
height:100%;
display:block;
padding:0;
margin-bottom:5px;
}
.block2 {
padding-left:5px;
}
.left, .right {
min-width:53px;
}
.middle_cont, .left_middle,.right_middle {
background:#ffdac0;
height: auto !important;
height: 100%; /* для IE6 */
}
.middle_cont, .middle_cont2 {
height: auto !important;
height: 100%; /* для IE6 */
min-height: 46px;
float:left;
width:840px;
position:inherit;
}
.left {
float:left;
}
.right {
float:right;
}
.left_top, .left_bottom, .right_top, .right_bottom {
width:53px;
height:23px;
}
.left_top {
background: url('/img/site001/content_blocks/left_top.png') no-repeat;
}
.left_bottom {
background: url('/img/site001/content_blocks/left_bottom.png') no-repeat;
}
.right_top {
background: url('/img/site001/content_blocks/right_top.png') no-repeat;
}
.right_bottom {
background: url('/img/site001/content_blocks/right_bottom.png') no-repeat;
}

HTML:
<div class="block1">
<div class="left">
<div class="left_top"></div>
<div class="left_middle"></div>
<div class="left_bottom"></div>
</div>
<div class="middle_cont">
<a class="vacancy_title" href="javascript:void(0);">Менеджер по работе с клиентами:</a>
<div class="vacancy_full">
<h4>Требования:</h4>
<ul>
<li>м/ж;</li>
<li>Образование высшее или неоконченное высшее;</li>
<li>пользователь ПК (Word&sbquo; Excel&sbquo; Outlook);</li>
<li>активная жизненная позиция;</li>
<li>Опыт работы с людьми.</li>
</ul>
<h4>Обязанности:</h4>
<ul>
<li>Работа с имеющейся базой клиентов;</li>
<li>Сопровождение проектов и проведение документации;</li>
<li>Активное взаимодействие с менеджером по продажам и специалистами (web-мастерами).</li>
</ul>
<h4>Условия:</h4>
<p>Вам нравится общаться с людьми? У вас это получается? Хотите развивать в себе коммуникативную культуру и знания в области современных технологий? Тогда эта работа для вас! Компания &quot;Первый сайт&quot; будет рада соискателям как с техническим&sbquo; так и с гуманитарным образованием&sbquo; желающим приобрести уникальный опыт работы с людьми&sbquo; а не с техникой!</p>
<p>Для тех кто готов работать&nbsp;мы предлагаем:</p>
<ul>
<li>официальное трудоустройство;</li>
<li>профессиональный и карьерный рост;</li>
<li>достойная заработная плата;</li>
<li>молодой&sbquo; энергичный&sbquo; дружный коллектив.</li>
</ul>
</div>
</div>
<div class="right">
<div class="right_top"></div>
<div class="right_middle"></div>
<div class="right_bottom"></div>
</div>
</div>
<div style="clear:both;"> </div>
Ответы:
супер верстка, преклоняюсь...


13 лет назад

RPI.su - самая большая русскоязычная база вопросов и ответов. Наш проект был реализован как продолжение популярного сервиса otvety.google.ru, который был закрыт и удален 30 апреля 2015 года. Мы решили воскресить полезный сервис Ответы Гугл, чтобы любой человек смог публично узнать ответ на свой вопрос у интернет сообщества.

Все вопросы, добавленные на сайт ответов Google, мы скопировали и сохранили здесь. Имена старых пользователей также отображены в том виде, в котором они существовали ранее. Только нужно заново пройти регистрацию, чтобы иметь возможность задавать вопросы, или отвечать другим.

Чтобы связаться с нами по любому вопросу О САЙТЕ (реклама, сотрудничество, отзыв о сервисе), пишите на почту [email protected]. Только все общие вопросы размещайте на сайте, на них ответ по почте не предоставляется.