Почему при свойстве float:left блок прилипает справа?

Question

[Тирион Ланнистер]

При том, что блоков слева нет
HTML

<div class="box>
            <div class="starter"></div>
            <div class="pro"></div>
        </div>

CSS

.box{
    position: relative;
    top: 160px;
    left: 815px;
    width: 700px;
    height: 600px;
}
.starter{
    width: 340px;
    height: 550px;
    background-color: #fff;
    float: left;
}
.pro{
    width: 330px;
    height: 510px;
    background-color: #000;
    float: left;
}

Answer 1

[Максим Тимофеев]

1. пропущена кавычка после "box
2. если position: relative; тогда зачем top: 160px; left: 815px; ?
codepen.io/wokster/pen/mAbaJJ

Comments

[Тирион Ланнистер]

top left для того,чтобы прикрепить контейнер куда мне надо.Мог и с помощью MARGIN, но там был бы конфликт полей . Есть альтернативные варианты?

[Максим Тимофеев]

Тирион Ланнистер: А чем codepen.io/wokster/pen/mAbaJJ не устраивает. Это Ваш код и он работает, только кавычку добавьте и все.

Answer 2

[John Doe]

Поменяй местами div'ы. Имхо поможет