Fl_SparkyBooMan

Добавьте код или хотя бы картинку html разметки или применяемых css стилей для полноты картины. А лучше и то и другое)))

<div class="btn>
<div class="btnContainer">
<div class="btnText"> Send Message </div> //текст кнопки
<div class="btnIco"> -> </div> //иконка кнопки, можно в виде знака, можно и в виде картинки
</div>
</div>

.btn {
width: 150px;  //задаешь свое значение длины
height: 50px;  //задаешь свое значение
padding: 10px;  //задаешь внутренний отступ для блока с классом btn
border-radius: 50%;   //задаешь окружность бордера
background-color: #fff;  //задаешь значение цвета фона кнопки
}
.btnContainer {
width: 100%;  //длина блока с классом btnContainer полностью заполняет блок btn
height: 100%;   //высота блока с классом btnContainer полностью заполняет блок btn
margin: 0 auto;  //выравниваем блок btnContainer по середине
text-align: center;  //выравниваем текст внутри блока btn container
}
.btnText {
width: 80%;
height: 100%;
float: left;  //стыковываем к левому краю
//далее оформляешь как хочешь
}

.btnIco {
width: 20%;
height: 100%;
float: right;  //стыковываем к правому краю
//далее оформляешь как хочешь
}

Padding - это внутренний отступ блока, а margin - это внешний отступ блока! В вашем случае надо padding заменить на margin, т.е. вы просто внутренний отступ меняете на внешний))

Советую прочитать о псевдо-классах в htmlbook.ru .Этот эффект создается когда, к элементу например div или в основном a присваивается в стилях CSS псевдо-класс ":hover" и выглядит это так:
HTML
Ссылка с классом link
CSS
.link:hover { //присваивает стили при наведении мыши
color: #ccc; //меняет цвет текста
border-bottom: 1px solid #000; //меняет подчеркивание, в частности его цвет и толщину
}