Размещение ввода HTML и кнопки по горизонтали

Question

У меня есть некоторые проблемы, делающие что-то довольно простое (я думаю).Я хотел бы разместить кнопки Save и Copy в одной строке и расположить их по центру по горизонтали в следующем коде:

https://codepen.io/anon/pen/XYLmwb?editors=1100

HTML:

<div class="wrapper">
 <form>
  <textarea id="notes"></textarea>
  <input id="save" type="submit" value="Save" />
 </form>
 <button id="copy-btn">Copy</button>
</div>

CSS:

#notes {

}

#save {

}

#copy-btn {

}

.wrapper {
 text-align: center;
}

Важно, чтобы структура HTML оставалась неизменной и чтобы это выполнялось с помощью CSS.У кого-нибудь есть предложения?

Answer 1

#notes {
    float: left;
}

#save {
    float: left;
    margin: 7px 0px 0px 5px;
}

#copy-btn {
    position: absolute;
    margin: 7px 0px 0px 5px;
}

.wrapper {
  text-align: center;
}
.wrapper form{
    display: inline-block;
}
.wrapper button{
    display: inline-block;
}

Только не забудьте очистить поплавок. ясно: оба;