CSSクラスでボーダー半径が機能しない

Question

ボタンにボーダー半径を追加しようとしていますが、下のCSSコードでborder-radius: 5px;を使用しても何も起こりません。それ以外のすべてはうまく機能しません。私が読んだことはすべてそれがどのように動作すべきかということですが、以下のコードではそうではありません。私はちょうど下に何かを見逃しているかどうかわからない？

HTML：

<button class="button" style="vertical-align:middle"><span>Play</span></button> 

CSS：

html { 
height: 100%; 
} 

body { 
background-image: url("/images/wallpaper.jpg"); 
background-size: 100% 100%; 
background-repeat: no-repeat; 
height: 100%; 
overflow: hidden; 
} 

.heading { 
font-family: Sedgwick Ave Display; 
font-size: 70px; 
color: #cccc00; 
} 
.subH { 
font-family: Cinzel; 
font-size: 8px; 
position: fixed; 
bottom: 0.05px; 
left: 1190px; 
color: white; 
} 

.boxhead a { 
color: #FFFFFF; 
text-decoration: none; 
} 

.button { 
    border-radius: 55px; 
    position: fixed; 
    top: 140px; 
    left: 75px; 
    font-size: 70px; 
    font-family: Sedgwick Ave Display; 
    display: inline-block; 
    background-color: #cccc00; 
    border: none; 
    color: #FFFFFF; 
    text-align: center; 
    font-size: 28px; 
    padding: 20px; 
    width: 200px; 
    transition: all 0.5s; 
    cursor: pointer; 
    margin: 5px; 
} 

.button span { 
cursor: pointer; 
display: inline-block; 
position: relative; 
transition: 0.5s; 
} 

.button span:after { 
content: '\00bb'; 
position: absolute; 
opacity: 0; 
top: 0; 
right: -20px; 
transition: 0.5s; 
} 

.button:hover span { 
    padding-right: 25px; 
} 

.button:hover span:after { 
opacity: 1; 
right: 0; 
} 

Answer 1

.button { 境界半径：5pxの。 //これは

動作しないものですそしてこれは、なぜそれが動作しないです：あなたがさらに下に同じルール内の行のカップルを持っている

border-radius: 4px; 

を...これにより、が上書きされてに上書きされます。