<html> <style> .rtop, .rbottom{ display:block border: 1px solid black; } .rtop *, .rbottom *{ display: block; height: 1px; overflow: hidden; background:red; } .r1{ margin: 0 5px } .r2{ margin: 0 3px } .r3{ margin: 0 2px } .r4{ margin: 0 1px; height: 2px} </style> <div id="container"> <b class="rtop"> <b class="r1"></b> <b class="r2"></b> <b class="r3"></b> <b class="r4"></b> </b> <div style='background:red;'>yyyyy </div> <b class="rbottom"> <b class="r4"></b> <b class="r3"></b> <b class="r2"></b> <b class="r1"></b> </b> </div> </html> Товарисцщи! Помогите разобраться в данном коде, как менять размер и положение данного блока??? И возможно создать класс или стиль который бы сразу менял цвет блока и закругленных углов? Простите за нубость, пытаюсь овладеть css версткой, надеюсь на понимание и помощь.