p::first-letter {
font-size: 3em; /* Размер буквицы */
padding: 3px; /* Поля вокруг первой буквы */
margin-right: 5px; /* Отступ справа */
color: #e7685d; /* Цвет буквицы */
float: left; /* Обтекание по правому краю */
line-height: 0.33em; /* Положение относительно текста */
}
p { clear: left; }
<p>Жил однажды бедный человек, и было у него сыновей
что дырочек в сите, даже на одного больше. Днем и ночью горевал
бедняга: что ему делать с детьми, очень уж много их, не перечесть.
Никак не мог он придумать столько ремесел, чтобы каждому что-нибудь
другое досталось.</p>
Никита, ну и чтобы кнопки не дергались при переключении то border не убирайте, а делайте прозрачным. А то получается что кнопка уменьшается на 1px с каждого края
Emmet1, при коде выше все элементы контейнера раскидываются по краям подгоняя равнозначное пространство между элементами. Как должен себя вести последний ряд?
Никита, вы псевдоэлемент before добавляете по классу, а он должен быть изначально у button с opacity: 0, а у довешеваемого класса у псевдоэлемента opacity: 1; ну и про transition у псевдоэлемента не забыть