• 締切済み

リキッドレイアウトで親boxと子boxの位置

CSSのpositionについて、解らないので教えていただけませんか? アメブロを使っています。 ある程度固定されたHTMLタグ内にCSSで隙間を作り、追加のボックスを入れたいのですが、リキッドレイアウトらしくて、新しく作ったボックスの位置指定が出来ません。 ブラウザに固定するとブラウザを広げた時に位置が変わってしまうし、他のボックスをposition relative にしても、その子ボックスに入れる事が出来ません(アメブロはHTMLファイルの改変は出来ないため) 要は、ブラウザを広げたり、縮めたりすると、メインのコンテンツと新しいボックスが、右に左にずれてしまいます。 これを解消するよい方法をご存知の方居られましたら是非教えて頂けませんか? よろしくお願いします。

  • CSS
  • 回答数1
  • ありがとう数0

みんなの回答

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

回答がつきませんね。たぶん質問が理解できないのだと思います。 (アメブロはHTMLファイルの改変は出来ない)と書かれていながら、「追加のボックスを入れたい」が矛盾しているからでしょう。  それがボックスであるか、行内要素であるかはスタイルシートで(非推奨ですが)変更はできますが、そもそも要素をHTMLに追加・変更ができない限り、スタイルシートでは手が出せないのです。  そこが矛盾しているので・・・・

関連するQ&A

  • CSSのリキッドレイアウトについて質問します。

    2列で左列がサイドバー,右列がコンテンツのリキッドレイアウトを考えています。 左列を固定幅にして,右列のmargin-leftに左列の横幅分の値を設定しています。 横幅が広い画面で見ると、一行が大変長くなります。 最近、横幅が1920の画面で確認すると、 大変読みにくいことに気づきました。 IE6では、min-width,max-widthが設定できないとあります。 IE6では、CSSでリキッドレイアウトを行なう場合、 横幅を調整する方法はないのでしょうか。 ※また、CSSを使ったリキッドレイアウトを実現している、 お勧めサイトがありましたら、教えてください。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • リキッドレイアウトデザインについて

    リキッドレイアウトデザインについて 記事がボックスになっていて、画面サイズによって位置が変わるという リキッドレイアウトのサイトをよく見かけますがこれはどういった造りに なっているのでしょうか? 方法や、どんな技を使っているのか解説されているサイトなどありましたら教えていただけないでしょうか! こんな感じです http://www.daggerfin.com/subconscious/

    • ベストアンサー
    • HTML
  • css。横並びBOXに長文textを流し込む方法

    css。横並びBOXに長文textを流し込む方法はありますか? CSSについてです。 高さ固定の横並び3連BOXに長文テキストを流し込む場合。 ブロック要素で区切るでもなく、センテンスの終わりでもない箇所で、複数のBOXにまたがるCSSになります。。。。 レイアウトのBOXサイズは固定だが、 テキストは文章の途中で隣のBOXへ移り、文字サイズの変更 (ブラウザやOSの違い)で隣のBOXへ移る位置も変わる。 これを実現させたいのですが、、、。 まぁ紙媒体においての、1ページ3段組みレイアウトの流し込みを HTMLで可能なのか?という質問になります。 文書作成ツールやデザインアプリでは当たり前な方法ですが。 CSSでも可能なんでしょうか? または、このようなことが可能な jQueryがありましたら ご紹介ください。

    • ベストアンサー
    • CSS
  • ホームページ作成に関する質問

    現在ホームページを次のようなレイアウトで作っています。 ----------------------------- -----------------------------      (1)ヘッダー     ----------------------------- (2)リンク| --------- (3)リンク| (5)コンテンツ --------- (4)リンク| --------- -----------------------------      (6)フッター     ----------------------------- ----------------------------- 各ボックスをdiv要素で作っているのですが、(5)、(6)の配置がうまくいきません。 (5)をcssの position:relative; で相対位置を指定して配置すると、(6)が離れた下のほうにできてしまいます。誰かよい配置法を知っておられたらご教授願います。

    • ベストアンサー
    • HTML
  • CSSレイアウト

    CSSのレイアウトについてお聞きしたいのですが、 レイアウトを決めるときwidthとheightだけを指定して 作ったボックスを重ねていく感じでレイアウトをしているですが 画面最大化にしておかないとレイアウトが崩れてしまいます。 やはりCSSでのレイアウトの場合positionで絶対値を一つ一つ 指定していかなければなれないのでしょうか? またCSSレイアウトのコツのようなものがありましたら教えて下さい どうぞよろしくお願いいたします。

  • 並んだ2つのfloatボックス、片方を固定位置にしたい

    floatでボックスを2つ並べたものの、左側のボックスを、右側のコンテンツ量が増えても、いつでもブラウザの固定された位置の表示させていと考えています。 現在、このfloatの2つのボックスは、大きなボックスで囲んでおり、 topから160pxの余白をとっています。 また、この大きなボックスは、常にセンターにある状態です。 ・トップから常に160pxのマージンが欲しい ・左側の余白は、ブラウザの大きさに寄ってかわる(センタリングの為) ・右のボックスは自由に動く。 この状況で、左のメニューだけを固定することは可能でしょうか。 教えてください。 現在ソースは下記のようにしております。 【HTML】 <div id="container"> <div id="gNavi"> 固定したいメニューBox </div> <div id="main"> スクロールするぐらいの長文Box </div> </div> 【CSS】 * { margin:0 ; padding:0; } body { text-align:center; } #container { width:894px; margin:160px auto 65px auto; } #gNavi { position:fixed; float:left; top:160px; left:auto; width:175px; } #main { float:left; width:716px; margin:0 0 0 2px; text-align:left; overflow:auto; }

    • ベストアンサー
    • CSS
  • CSSでボックスの位置をずらすCSSなどはある?

    HTMLないしはCSSでボックスの位置をずらすCSSなどはあるのでしょうか? 上に1cm動かすなどできないのでしょうか?

    • ベストアンサー
    • HTML
  • CSSでのレイアウトについて

    HTML、CSS超初心者なのですが CSSでレイアウトを組むと ブラウザを縮小したりしたときに レイアウトがぐちゃぐちゃになります paddingやmarginはpxで指定してるのですが それがいけないのでしょうか? |   | |あああ| |   | こういうレイアウトの物が ブラウザを小さくすると || ||あああ || とボーダーがちいさくなって 中の文字がはみ出してしまいます どうぞよろしくお願いします

  • ブラウザの大きさによって背景画像の位置が違う

    ブラウザの大きさによって、背景画像の位置(横位置)が変わってしまうのですが、どうしたらブラウザの大きさに依存せずに背景画像を一定の位置に置くことができるのでしょうか?? 背景画像はcssのbackground-positionで横位置のみ%を使って指定しました。 left center rightなどで指定すると、ブラウザ関係なく、固定の位置で表示してくれるのですが、今回はレイアウト的に%を使って微妙な位置に表示させたいのです。 この説明では分かりづらいかもしれませんが、 %を使わなくても微妙な位置に設定でき、ブラウザの大きさに依存しない方法などありましたら、アドバイスをお願いいたします!!

  • お叱りを受けるような質問なのですが・・・

    CSSをかじって1年位なのですが、HP作ってふと疑問に思うことがあるのです。 CSSは、主に文書のレイアウトやデザインの為の言語ですよね。で、その目的で使う分については、テキストの位置、画像の位置すべてposition.relativeで思うようにできると思うのですがそれでは、だめなのですか? paddingやfloatとかdivとか使わなくても・・・と思うのですが・・・。 グループで分業してやってるわけではないから、すべてposition,relativeでレイアウトしてもいいと思うのですが、どうなんでしょう?

    • ベストアンサー
    • HTML

専門家に質問してみよう