Здравствуйте, помогите с разбивкой средствами CSS
 

надо разбуить на колонки как на рисунке, я новичек пока не получается это грамотно сделать.

Пробывал так, не идет((( подскажите как поправить. заранее спасибо
.otstup
{
float: left;
border: 1px solid black;
padding: 8px;
}

.neotstup
{
display: inline;
}

Ты хоть бы полный хтмл пример сделал... :D

а какой код html вышел?

делаю на друпале, хочу выставить таким образом поля в отображении.
на их форуме, сказали классами CSS выравнивай, поставил модуль Field Formatter Class, он позволяет добавлять каждому полю свой класс.
но не могу скофигурировать это правильно, второе поле .neotstup всегда убегает вниз под .otstup

получается просто верстка нужна, а так все работает

всё верно, это из-за float: left;

animhotep,
а можно как-то это исправить? чтоб поля как на миниатюре отображались

можно, но наугад сложно
приведи тот кусок html кода. непонятно же что там как

.main {
    width: 520px;
}
.main:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.footer {
    height: 20px;
    background-color: #222;
    margin: 5px 0;
}
.left {
    width: 100px;
    height: 100px;
    background-color: #777;
    margin: 0 10px 0 0;
    border: 1px solid black;
}
.right {
    width: 400px;
}
.left, .right {
    float: left;
}
.art {
    height: 30px;
    background-color: #999;
    border: 1px solid black;
    margin: 0 0 3px 0;
}

<div class="main">
    <div class="left"></div>
    <div class="right">
        <div class="art"></div>
        <div class="art"></div>
        <div class="art"></div>
    </div>
</div>
<div class="footer"></div>

http://jsfiddle.net/BETEPAH/jJwVa/

Это конечно шедевр! :D