親要素からの縦位置と、(改行している際は)要素同士の横の間隔に関係してきます。
SCSS
@import "compass/reset"; .btns { width: 100%; height: 30px; background: #6e6e6e; text-align: center; &:nth-child(odd) { background: #3e3e3e; } &:nth-child(1) { font-size: 0px; } &:nth-child(2) { font-size: 10px; } &:nth-child(3) { font-size: 15px; } &:nth-child(4) { font-size: 20px; } &:nth-child(5) { font-size: 25px; } &:nth-child(6) { font-size: 30px; } } .btn { display: inline-block; margin: 0; border-radius: 50%; width: 5px; height: 5px; background: rgba(255, 255, 255, .5); cursor: pointer; }