Как спозиционировать блок согласно БЭМ?

HTML:

<header class="header">
  <div class="header-form">
    <div class="form">float:right</div>
  </div>
  <div class="header-logo">
    <div class="logo">float:left</div>
  </div>
  <div class="header-search">
    <div class="search">float:left</div>
  </div>
</header>

CSS:

.header {
  background-color: red;
  width: 100%;
  height: 400px;
}

.header-form {
  float: right;
  width: 20%;
}

.header-logo {
  float: left;
  width: 30%;
}

.header-search {
  float: left;
  width: 50%;
}

.logo {
  height: 50px;
  background-color: blue;
}

.search {
  background-color: green;
  height: 50px;
}

.form {
  background-color: orange;
  height: 50px;
}

Блоки позиционируются через элемент родителя
в .header нужен .header__form которому будут заданы позиционирование и размеры
в него положи .form сам блок, который примет размер .header__form

про поменять местами, тут можно задать float всем в одну сторону. А лучше разбирай сетки на флекс

<header class="header">

    <div class="form header__form">float:right</div>
    <div class="logo header__logo ">float:left</div>
    <div class="search header__search">float:left</div>
</header>

.header__form
  float:right;

.header__logo
  float:left;

.header__search
  float:left;