- 締切済み
レイヤーの固定の方法
レイヤーの対して、「position:absolute」を指定すると、親要素の位置を 基準に配置場所が決まりますよね。 ある画像を画面のセンター揃えにした場合、自動的に画面のセンターに表示 されるようになります。これだと画面のサイズによって画像の座標が変わって しまいます。 今は<BODY>タグが親要素となっているため、レイヤーの位置が画面のサイズに よって違ってしまいます。（つまり画面の上から40px、横から100pxという指定） 画面のサイズによって座標が変わる親要素からレイヤーの位置を指定したいのですが、その方法がわかりません。 解決策を教えてください。 果たしてこの説明で意味が伝わったでしょうか？？心配…。
- kumano_poohtaro
- お礼率75% (25/33)
- CSS
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- jakarta
- ベストアンサー率38% (607/1597)
おや？と思ったのですが <center> <table><tr><td> <IMG SRC = "img//logo.gif" class = logo> と組んだ時にネスケ6.2だとテーブルを親として判断せずにウインドウを 基準に座標をとるようです。IEだとOKなんですけどねぇ
- jakarta
- ベストアンサー率38% (607/1597)
説明が分かりにくいのでできればサンプルを呈示していただいたほうが わかりやすいかも・・ 配置に関しては以下のキーワードが用意されています。 通常の場所から相対的 relative 親に対して絶対的に配置 absolute 親要素に絶対的。不動 fixed この点に関してはご存知かと思います。固定的に配置するのであれば head中にスタイルシートの指定をいれるとした場合 IMG.logo { z-index:auto; position:absolute; top-10px;left:30px;} といれて <IMG SRC = "img//logo.gif" class = logo>とクラスを 指定してやればOKです。 親要素に対して相対的であるならposition:relativeでよいのではないで しょうか。
関連するQ&A
- レイヤーの位置を固定しない方法
こんにちわ、CSSのレイヤーについて質問させていただきます。 レイヤーをセンター寄せのホームページに使うのですが、普通に記述すると、 #Layer1 { position:absolute; left:499px; top:537px; width:130px; height:107px; z-index:1; } となり、絶対位置になります。 これをrelativeを使うと、ウィンドウサイズを変更した際、その場にレイヤーの内容が残り、ページをリロードさせないと相対位置になりません。 これをリロードしなくとも相対位置になるような方法が書かれているホームページをご存知ではないでしょうか？ （ウィンドウのリサイズとレイヤーの位置連動してほしいのです・・・） どうぞよろしくお願いいたします。
- 締切済み
- その他（プログラミング・開発）
- レイヤーを画面の左右中央に重ねて配置したい
質問No.1083158：レイヤーを画面の中央に配置したい を見て、おお、これだ！と思って試してみましたが、レイヤーを重ねることはできませんでした。 "position:absolute;"を指定しないとレイヤーを重ねられない（ですよね？）、でもそうするとセンタリングできない、ということでしょうか？ 現在は、レイヤーの幅を100％にして「中身」をセンタリングしたものを重ねていますが、これだと他の要素（特にリンク）の上に重ねられないのでレイアウトに制約があります。 上下方向の位置とサイズを指定した複数のレイヤーを重ねる方法はないのでしょうか？
- ベストアンサー
- HTML
- ＣＳＳについて 初心者です。positionについて
勉強中です。 すいません。教えてください。 「親要素を基準に子要素の位置を指定するには、 親要素に position: relative を指定し (absoluteにする理由があるならそちらでも良い)、 子要素に position: absolute を指定すればよいと言うことになる。」 となりますが、この概念がさっぱりわかりません。 確かに、子要素の位置をposition: absoluteで配置しようとした際に、 親要素にposition: relative（しかも、値はなし）で設定しないとうまく行きませんでした。 ネットで調べても全く意味がわかりませんでした。 なぜ子要素の位置をposition: absoluteで配置しようとした際に親要素に、position: relativeをしかも値なしで設定しないと、うまくいかないのか 詳しく教えていただけないでしょうか？m(..)m
- ベストアンサー
- HTML
- positionについて下記の認識で正しいでしょう
positionについて下記の認識で正しいでしょうか？ ・relativeは動かしたい要素自体にpositionプロパティをつける。親要素にpositionプロパティはいらない。 { position: relative; top:100px; left:10px } ・absolute; 絶対。 親要素の背景 { width: 100%; position: relative; background: url(../img01.jpg) no-repeat left top; } 子要素の動かしたい要素 .box.box02 p{ position: absolute; left: 0; top: 0; } ＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿ ・absoluteは、親要素も何も関係なしにブラウザ上の上から何PX左から何PXと指定して、要素を配置でできる。 ただし例外として、 親ボックスにpositionプロパティのstatic以外の値が指定されている場合には、親ボックスの左上が基準位置となります。 親ボックスにpositionプロパティのstatic（初期値）以外の値が指定されていない場合には、ウィンドウ全体の左上が基準位置となります。（個人的に単独で使う事はほぼないです） ・relativeは、親要素から、何PX左から何PXと指定して、要素を配置でできる 補足また、まとめて指定する方法はマージンのようにないのでしょうか？
- ベストアンサー
- CSS
- レイヤーの位置を固定する方法
メニューにマウスをのせたら、その下にサブメニューが表示されるようにしたいと思っています。 （TOYOTAの2階層目以降のような感じです） Flashは使わずレイヤーで作っているのですが、ブラウザを全画面に大きくして見るとちゃんとした位置に表示されていても、小さくするとレイヤーの部分が右にずれてしまうのです。 メニューボタンの下にそれぞれレイヤーを作っており、タグは<div>を使用しています。 また、Dreamweaver8を使っていて、レイヤーの左・上からの位置を適当にpxで指定しています。 常に同じ場所にレイヤーが表示されるようにするには、どうしたらいいのでしょうか。 わかりづらいかと思いますが、よろしくお願いいたします。
- ベストアンサー
- HTML
- Photoshopのレイヤーを正確な位置に配置できますか？
Photoshop CS2 を使っています。 あるビットマップのレイヤーを、別のファイルの同じ位置に貼り付けたいのですが、何か良い方法はありませんでしょうか？目分量ではなく正確な位置を指定して並べたいのですが、どうしてもうまく行きませんでした。 例えば、このレイヤーは（何ピクセル，何ピクセル）の座標に配置、といった風に指定できないのでしょうか？ また、レイヤーのサイズが、何ピクセル×何ピクセルかという事も調べる方法もあればお願いいたします。 Painter に慣れていたせいか、Photoshop での配置方法がどうしてもわかりませんでした。
- ベストアンサー
- グラフィックソフト
- HTMLとCSSを教えてください。
画像を中央揃えしたいのですが、 <img src="xxx.jpg"> img{ text-align:center; } とやったのですが、中央揃えできないのですがなぜでしょうか？ もうひとつ質問させてください。図書館の参考書に書かれている内容で、「今はtext-align:center;よりposition:absolute;top:105px;left:50px;を使う事が多くなっています」と書いてありました。ほかにもサイトのソースをみると、absoluteを使用しているサイトを良く見かけますが、positionを使ってデザインすると画面サイズとか、見るブラウザによってデザインが崩れてしまわないでしょうか？そうなるとやはりtext-align:center;を使うのがいいのではないでしょうか？ どれも初歩的ですみませんが、よろしくおねがいします。
- ベストアンサー
- HTML
- positionについて
positionについて教えてください box内にbox2をpositionで配置したいのですが子要素のboxに指定するpositionはrelativeとabsoluteどちらがいいですか？ また、子要素のboxにrelativeを指定した場合とabsoluteを指定した場合の表示の違いはありますか? #box { position: relative; } #box2 { position: relative; top :50px; left: 100px; width: 100px ; height: 100px ; background-color: #F90; }
- ベストアンサー
- CSS
- 要素の配置方法について・・・
要素を直接配置する方法として、 CSSのpositionで指定する方法がありますよね。 今、XHTML1.0Trasionalでホームページを作っているのですが、 position:relative; top:0px; left:0px; と指定してもうまくいきません。（ピクセルは今だけ0にしました） position:absolute;でもやってみたのですが、 変わりませんでした。 だれか、この解決策を知っている方はおらっしゃるでしょうか？ 知っていたのなら、ぜひお教えください。 ただ単に、私が間違っていたと言う事もありえますので、 うちでは、ちゃんとなったよ！ という人もおられましたら、 是非ご回答お願いします。
- 締切済み
- HTML
