2017-05-10 15 views
0

問題があるとわかりません。すべてのデバイスでページ上のボタンを完全に中央に置くことができる唯一の方法は、幅:100%を適用することです。:100%芯出しボタンを制御する唯一の方法は?

しかし、これで問題になるのは、広がったボタンを作ることです。私はそれをカットしたいと思います。問題は、いつでも私が幅を取り除くことです:何らかの方法で100%、それは完璧なボタンの位置がうんざりになる。

どのように私のボタンを中央に置くことができますが、スーパーワイドではありません。ありがとうございました。 -Wilson

サイトへのリンク:http://www.wilsonschlamme.com/test3.html

CSS:

img { 
width:100%; 
max-width:500px; 
max-height:340px; 
box-shadow: 5px 5px 5px grey; 
border-style: groove; 
border-width: 1px; 
position: absolute; 
top: 107px; 
} 


button { 
color: #900; 
font-weight: bold; 
font-size: 150%; 
text-transform: uppercase; 
width: 100%; 
position: relative; 

top: 600px; 


} 



#ShowText{ 
width: 800px; /* change to your preferences */ 
overflow:hidden; /* older browsers */ 
position: absolute; 
margin-top: 500px; 
text-align: center; 
margin-left: -140px; 
font-size: 18px; 
font-family: vendetta, serif; 
line-height: 25px; 

} 

h1{ 
position: absolute; 
top: 5px; 
font-size: 250%; 
width: 800px; /* change to your preferences */ 
overflow:hidden; /* older browsers */ 
font-family: hobeaux-rococeaux-sherman, sans-serif; 

} 


#wrapper { 
width: 500px; 
margin: 0 auto; 
} 

答えて

0

はdiv要素を中心に完全なガイドがあります。このサイトを見てみましょう。 http://www.tipue.com/blog/center-a-div/

+0

私はこのサイトを調査します、ありがとうございます。 – Masteryogurt

+0

[本質的にリンクからなる回答を投稿しない](http://stackoverflow.com/questions/how-to-answer)。あなたの答えに重要な点を含めてください。追加情報や参考資料としてリンクを張ってください。 – wasthishelpful

0

私は主にあなたの要素のための絶対位置を使用してお使いのベースだか分からないが、あなたの問題に答えるために、テキスト整列与える:センター; #wrapperに渡してから、ボタンを除く#wrapperの各子に対してtext-align:leftを与えます。

+0

私の基盤は私の知識の欠如です。私は開発に非常に新しいです。私はその使用例を見ました。私はそれを与えるだろう、ありがとう。 – Masteryogurt

+0

#ラッパーの「子供」のそれぞれが何を意味しているかを詳しく説明してください。 – Masteryogurt

+0

これはスタイリングのためのリマインダーであり、絶対的なポジショニングには依存しないようにしておく必要があります。また、ボタンの幅を指定した場合(width属性のデフォルト値であるautoまたはあなたの場合のような100%ではない)、マージンを追加することができます:0 auto;そのボタンに –

関連する問題