<div class="head-btn wow fadeInLeft">
<a href="#intro" class="btn-primary">Get started</a>
<a href="#intro" class="btn-default">Read more</a>
</div>
.head-btn {
margin-bottom: 40px;
}
.btn-default {
font-size: 16px;
margin: 30px 0 10px;
padding: 15px 30px;
height: 35px;
border-radius: 80px;
}
しかし、小規模ではそのようなその表情をサイズ：悪いボタンの位置
これで私をhelpmしてください。ありがとう
、<a></a>要素がinline要素であり、その内容オーバーフロー場合inline要素はデフォルトで折り返されます。デフォルトのoverflow属性はvisibleなので、moreは次の行にReadと表示されます。この問題を解決するには
、内容オーバーフローをラップしていない、あなたのbtn-default要素を強制的に行white-space:nowrap;を追加します。
インライン要素の詳細については、https://www.w3.org/TR/CSS22/visuren.html#inline-boxesを参照してください。
ボタンにdisplay:block;を追加しようとしましたか？デフォルトでは
はい、それは助けません –
これは正しい答えです。右側の要素に 'display：block'を適用していることを確認してください。 – JDandChips
OPはおそらく他の競合するCSSを表示していません。 – andi
Read moreをRead moreに変更すると、 （改行なしのスペース）は単語間の折り返しを防止します。
私の解決策は次の行を追加することでした：inline-block; white-space：nowrap; –
inline-blockは、 'a'要素の高さまたは位置を設定するのに役立ちます。 – cmal