特定のCSSコードが動作しない

Question

私はウェブサイト用のCSSを書いていましたが、私のCSSの一部が意図したとおりに動作しないことがわかりました。何が起こったのかは、特異性が最も高いセレクタ内で、要素の幅やマージンを調整しようとしたときに変更されなかったことです。しかし、同じセレクタ内では、問題なく他のプロパティを調整することができます。

は

.get-touch { 
    text-decoration: none; 
    margin: auto; 
    margin-top: 35px; 
    color: #fff; 
    width: 200px; 
} 

これは、ボタンに適用され、このセレクタを取るe.g.:-、と私はその幅を大きくしたかったです。 幅を500pxに変更しても、幅はまったく変わりません。しかしながら。他のプロパティへの変更はブラウザに反映されます。ここで

、私は問題をもたらし、私の特定のCSSファイルにファイルを添付している： - https://drive.google.com/open?id=0B1CjX_FVqdRjWGRkS3NLOG9tTEE

これはどのように発生する可能性があります、と私はそのような問題を防ぐために何ができるのでしょうか？あなたはbuttonサイズはそれwidthを与えた後でも変更されていないことを述べてきたように

Answer 1

.get-touch { 
    display: inline-block; /* Add this */ 
    text-decoration: none; 
    margin: auto; 
    margin-top: 35px; 
    color: #fff; 
    width: 200px; 
} 

が、それはあなたが適用されることを意味し、あなたのそのbox-modelをレンダリングすることはできませんinline要素ので、ブラウザ上CSS。 display:inline-blockプロパティを追加すると機能します。