Почему инлайн-блок не выравнивает по нижнему краю?
Добавьте в свой css:.first_one:after {
  content:'';
  vertical-align: bottom;
  display: inline-block;
  height: 100%;
}
Для ночного чтения: https://habrahabr.ru/company/netcracker/blog/277433/
Можно зеленому блоку задать line-height: 500px;
Затем оранжевому вернуть line-height: 1.5em;codepen.io/anon/pen/pyJxjq