- 締切済み
背景とブロック要素をブラウザの中央に配置するには?
- みんなの回答 (3)
- 専門家の回答
関連するQ&A
- widthが可変のブロック要素で、常に中央から右部分だけに、背景画像を
widthが可変のブロック要素で、常に中央から右部分だけに、背景画像をrepeat-xしたいのですが、どうすればよいでしょうか? background-positionを使えば何とかできるかと思ったのですが、うまくいきません。 「widthが可変」 「常に中央から右部分」 「背景画像をrepeat-x」 この組み合わせ方をcssで実現できる方、もしいれば教えてください。
- ベストアンサー
- HTML
- CSSでBody要素への背景画像(san.jpg)の配置を以下の設定で
CSSでBody要素への背景画像(san.jpg)の配置を以下の設定でしてみました。 Dreamweavercs4でのデザインモードとIE7のプレビューでは 画面中央に配置されて見えますが、safariとfireFox3.6.2では添付画像のように 画面上部に画像の下半分だけが表示されます。 これはどうしてなのでしょう? それとFirefoxでも上下左右中央に表示されるようにするには どうしたらよいのでしょう? ご存知の方がおられましたら、ご教示ください。 ※ディスプレイ解像度1280×1024 背景画像サイズ592px × 568px ~~~~~~~~~~~~~~~~~~~~~ body { background-image: url(sun.jpg); background-repeat: no-repeat; background-position: center center; } ~~~~~~~~~~~~~~~~~~~~~
- ベストアンサー
- HTML
- サイトは中央配置、背景に画像、または色をつける
css初心者です。 サイト(すみませんこの言葉でいいでしょうか?)を ブラウザ画面の中央に配置したいとき cssでbodyを中央配置にしています。 その両サイドにも、色または画像をつけたいのです。 テーブルを使用せず 下記のページのように サイトは中央に配置、背景に色や画像をつけるには cssでどのように指定すれば よろしいでしょうか? http://www9.nhk.or.jp/umechan/ http://www.nikoand.jp/ よろしくお願いいたします。
- ベストアンサー
- CSS
- ブロック要素のボーダーに関して質問させて下さい。
ブロック要素のボーダーに関して質問させて下さい。 お世話になっております。添付画像はサイトのナビゲーションメニューの一部なのですが、各ブロック要素にボーダー(1pxのライン)を指定しているため、隣り合った箇所は2倍の太さになっています。 そこで、隣り合った箇所も1pxにしたいのですが、クラス名などを統一したままCSSなどで回避することは可能なのでしょうか? クラス名を適時変えたり、テーブルなどであれば回避することが出来ると考えていますが、クラス名を同じにしたままで回避することが出来ればと質問させて頂きました。 お忙しいなか恐縮ですがアドバイスのほど宜しくお願い申し上げます。
- ベストアンサー
- HTML
- ブロック要素のボーダーについて質問させて下さい。
ブロック要素のボーダーについて質問させて下さい。 お世話になっております。添付画像はナビゲーション用メニューの一部でリストにて表示させているのですが、各ブロック要素にボーダーを指定しているため、隣り合った箇所は2倍(1pxが2pxになっている)の太さになってしまいます。 これを回避するため、左サイド、右サイド、他、3種類のクラスを用いれば可能かと思われますが、クラス名など変更せずに回避することは可能でしょうか?
- ベストアンサー
- HTML
- imgタグのみで画像を中央に重ねる方法
HTML5+CSS3で画像を中央にフィットした状態で重ねる方法を調べています。 一般的にはbackground-size:contain;で背景を適用したDIV要素にimg要素を挿入しますが、この場合だと一部のブラウザでは背景が印刷されないことがあります。 そのため、background-imageを使わずにこれと同じ方法を実現したいのですが、何かいい方法はありますでしょうか。
- 締切済み
- CSS
- ブロック要素の幅を中身の幅に合わせるには?
CSSの記述に関してわからないことがあります。 ブロック要素の幅をブロック要素の中身の幅に合わせて自動的に変わるようにしたいのですが、CSSでそのような設定をすることは可能なのでしょうか? table要素を使えば可能なのは知っていますが、divのような他のブロック要素でも、CSSの設定を行えば可能なのでしょうか? 少し調べたところ、Firefoxの場合は display: table; とすればよいようなのですが、IE6では正しく表示できませんでした。他の手段はないのでしょうか? よろしくお願いします。
- ベストアンサー
- CSS
- 作っているページ内に背景を表示させるには
勉強不足で申し訳ありませんが、ホームページを独学で作成しています。 横幅950ピクセルのサイトを、中央表示させるように考えています。 その950ピクセルの左上の部分に、(繰り返しの無い)背景画像を表示させたいのですが、 CSSファイルにbackgroundで指定してやると、どうやら表示する画面のサイズに左右されるらしく、 範囲外に背景画像が出たり、自分が考えているのとは違う位置に表示されてしまいます。 ページ内のひとつの要素として、背景画像のように扱えるイメージを挿入するには、どうすれば良いでしょうか。
- ベストアンサー
- CSS
- ブラウザの中央に配置したい(長文)
CSS初心者です。 きちんと学んだことがなく、WWW上のリファレンスを参照しながらのサイト作成なので、変な質問だったらごめんなさい。 以下のようなHTML記述で、 <html> <head> <link href="css1.css" rel="stylesheet" type="text/css"> </head> <body> <div id="textbox"> <h2>あああ</h2> <h3>いいい</h3> <p>ううう</p> </div> </body> </html> 外部CSSファイルで次のように指定しています。 @charset "Shift_JIS"; #textbox{ margin-left: auto; margin-right: auto; float: center; width : 640px; align: center; } Firefoxで表示確認しながら作成し、一応希望通りにdivがブラウザの横幅に関係なく中央配置になるようになったのですが、IE6.0で確認してみたらfloat: centerがきいていないようで全て左寄せになってしまっていました。 textboxだけでなく、どのdivもそうなってしまいます。 また、フォントのサイズなどは指定どおりになっても、マージン・パディングもFirefoxの表示とはかなり違ってしまいます。 上記の記述で問題があればその点を教えていただければ助かります。 (説明の足りないことがあったらご教示ください) また、今後はブラウザ毎にCSSの指定を変えたほうがいいのでしょうか…。そこまで技術がないので、できるだけ応用のきくCSS記述を覚えていければと思っています。 よろしくお願いします。
- ベストアンサー
- CSS
- iframe要素を中央に寄せたいのですが
https://teratail.com/questions/80344 の様にiframe要素を中央に寄せたいのですが 「margin: auto;で中央寄せしたい場合はiframeにdisplay: block;をかけてあげれば良いです。」 との事ですが iframe { display: block; margin:auto; } margin: 0 auto; にしてもダメでした。 このリンクの通りやれば出来るものなのでしょうか?
- 締切済み
- CSS
- EPSONプリンターLP-S5300を使っている際に、感光体ユニットとトナー4色を交換した後に電源投入後、印刷できないエラーE600が表示されます。このエラーの対処方法について教えてください。
- EPSONプリンターLP-S5300の感光体ユニットとトナー4色の交換後、電源を投入すると印刷できないエラーE600が表示されます。このエラーの対処方法について教えてください。
- EPSONのプリンターLP-S5300を使用中に、感光体ユニットとトナーの交換後に電源を投入すると、印刷できないエラーコードE600が表示されます。このエラーに対しての対処方法を教えてください。
お礼
これだとウインドウサイズ変更すると、背景画像とずれてしまいます。 なんとか自己解決しました。お手数おかけしました。