<div style="padding-left: 10px; padding-right: 10px;"><div style="width: auto; background-repeat: repeat; height: 100%; background-color: white; box-shadow: 0px 0px 10px black; padding: 0px 0px 0px 50px;"><div style="height: 100%; background-color:blue; padding: 0px 0px 0px 50px; box-shadow: 0px 0px 1px black;"><div style="height: 100%; background-color: red; box-shadow: 0px 0px 0px black; padding: 0px 0px 0px 50px;"><div style="height: 100%; background-color: #FFEBCD; box-shadow: 0px 0px 0px black;">
ВАШ ТЕКСТ, Картинки и прочее</div></div></div></div></div></div>

Где цвета , и размеры полосок можно заменять на свои. ШИРИНА полосок (цветов флага) в пикселях. Можно их менять. Посмотрите на картинке.

В высоту рамка растянется сама, по вашему посту.



Голубым цветом выделена ширина полосок флага. В первом случае ( рамочка вверху) она у меня стояла 50px, сейчас я ее заменила на 20px Рамочка уже выглядит вот так. (код ее внутри рамки)

<div style="padding-left: 10px; padding-right: 10px;"><div style="width: auto; background-repeat: repeat; height: 100%; background-color:White; box-shadow: 0px 0px 10px black; padding: 0px 0px 0px 20px;"><div style="height: 100%; background-color:blue; padding: 0px 0px 0px 20px; box-shadow: 0px 0px 1px black;"><div style="height: 100%; background-color: red; box-shadow: 0px 0px 0px black; padding: 0px 0px 0px 20px;"><div style="height: 100%; background-color: #FFFACD; box-shadow: 0px 0px 0px black;">
ВАШ ТЕКСТ и картинки</div></div></div></div></div></div>

Цвета полосок флага, так же можно заменять. Открываем таблицу цветов, которая находится здесь УНИКАЛЬНАЯ ТАБЛИЦА HTML цветов, находим нужные цвета и заменяем
смотрим на картинке.



Голубым выделены цвета полосок флага, а красным, это цвет самой рамки, где будет расположен пост.

ВНИМАНИЕ из ТАБЛИЦЫ HTML цветов, можно брать как HTML Имя Цвета (это показано в полосках цвета флага и выделено ГОЛУБЫМ), так и его код (HEX), который показан в цвете самой таблицы (и выделено на рисунке КРАСНЫМ). Работает и так и так.

Если в вашей стране флаг двух цветный, то один блок с полоской можно выбросить. Вот код таблицы с двухцветным флагом.

<div style="padding-left: 10px; padding-right: 10px;"><div style="width: auto; background-repeat: repeat; height: 100%; background-color:White; box-shadow: 0px 0px 10px black; padding: 0px 0px 0px 20px;"><div style="height: 100%; background-color: red; box-shadow: 0px 0px 0px black; padding: 0px 0px 0px 20px;"><div style="height: 100%; background-color: #FFFACD; box-shadow: 0px 0px 0px black;"><br /> ВАШ ТЕКСТ<br /> </div></div></div></div></div>


И еще одна рамочка с флагом. Но полоски флага располагаются не сбоку, а сверху. Код такой рамочки внутри ее.

<div style="padding-left: 10px; padding-right: 10px;"><div style="width: auto; background-repeat: repeat; height: 100%; background-color:White; box-shadow: 0px 0px 10px black; padding: 20px 0px 0px 0px;"><div style="height: 100%; background-color: blue; padding: 20px 0px 0px 0px; box-shadow: 0px 0px 1px black;"><div style="height: 100%; background-color: red; padding: 20px 0px 0px 0px; box-shadow: 0px 0px 1px black;"><div style="height: 100%; background-color:#F5DEB3; box-shadow: 0px 0px 0px black;">
ВАШ ПОСТ
</div></div></div></div></div></div>