Как реализовать DIVами?

Доброго вечера,
подскажите пожалуйста как реализовать CMS вот такие штуковины которые я обозначил на картинке цифрами 1 и 2. Если это возможно как сделать DIVами?

Заранее спасибо

Покажи шаб в который ты хочешь это впихнуть. Дивами можно, свободно.

шаблона ещё нет, как раз сейчас этим занимаюсь, делаю на joomla 2.5.3 точнее пытаюсь построить дизайн на стандартном шаблоне

вот в таком шаблоне хочу это реализовать

Ну вообще тебе надо тупо вставить <div> </div> снизу и сверху блока с контентом. Присвоить правильные стилевые элементы, например, если использовался флоат, то надо будет очистить див, чтоб растягивался. Вообще htmlbook.ru в помощь, там все в подробностях.

П.С.
С телефона сижу, не могу скачать шаб. Попробуй сам, если не получится - пиши, разберемся

Спасибо большое сейчас буду сидеть пробовать)
я просто в этом деле не силён

Добавлено через 54 минуты
Хочу в одном ДИВе это реализовать, но не могу понять как сделать отступ между верхней и нижней колонкой, дабы между ними можно было текст вставлять.
Делаю так, подскажите где ошибка, показывается только верхняя красная колонка.

ты немного неправильно структурировал стили, варианта два!

Либо ты разбиваешь блок на 3 блока с индвидуальным стилем типа

.kolonka_up - стиль верхней красной линии
{width: 20px;
background: red;
padding: 5px;
padding-right: 200px;
float: left;}

.kolonka - сама колонка
{height: 300;}

.kolonka_down -стиль нижней черной линии
{
width: 20px;
background: black;
padding: 5px;
padding-right: 200px;
float: left;
}


Либо ты в блоке верхние и нижние линии описываешь через border

.kolonka
{
border-top: 10px solid #ff0000; - верхняя граница красного цвета толщиной 10 пх


height: 300; - высота блока


border-top: 10px solid #000000; - нижняя граница черного цвета толщиной 10 пх
}

почему то когда идут подряд

почему то отображается только та которая стоит сверху, в данном случае красная

Либо ошибка -опечатка в символе, либо у тебя в коде встроенный стиль имеет приоритет!

Для примера накидал - точно работает!

да, спасибо большое всё работает, не могу только разобраться как установить фиксированную длину полосок

Довольно плавучая тема, я ,что бы не заморачиваться, использую фреймворки с 960 grid system, там все просто с длиной и использовать очень удобно.

Длина полосок зависит от длины самого блока, задается свойством width, если тебе нужна разная длина полосок - то это реализуется через отдельные стили для каждой полосы или как вариант вырисовывать линии через <hr>, c описанием нужной длины и цвета