Как в CSS объединить две кнопки в одну?

Question

[Сергей]

Как можно из двух кнопочек сделать одну с закругленными краями по углам?

Answer 1

[Trow_eu]

codepen.io/anon/pen/gmFph

Comments

[Сергей]

Спасибо! ))

Answer 2

[chupok]

<div><button>Вкл</button><button>Выкл</button></div>

* {
    margin: 0;
}
div {
    display: inline-block;
    overflow: hidden;
    position: relative;
    width: auto;
    -khtml-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}
div button {
    background: red;
    border: 0;
    cursor: pointer;
    display: block;
    float: left;
    outline: 0;
    padding: 3px 15px;
    position: relative;
    width: auto;
    -khtml-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
div button:first-child {
    background: green;
}

jsfiddle.net/qdw9kbdq/18

Comments

[Сергей]

Спасибо! )

[chupok]

@Antaeus, да не за что.))

Answer 3

[Сергей]

Сделал две кнопки рядом но не знаю как сделать что-бы они прилегали друг к другу

Comments

[Сергей]

Абсолютное позиционирование накладывает одна на одну, а margin-left не дает результата