floatで段組。下を揃える。
- floatで段組を作成し、下を揃える方法についての質問です。
- 過去の質問にはtableを使う方法がありますが、divとfloatでの方法を知りたいです。
- 背景画像を設定した場合、下に同じ背景画像を表示しながら下を揃える方法はありますか。
- ベストアンサー
float で段組。下を揃える。
いつもお世話になります。 +------+---------------+ |AAAA |BBBBBBB | |AAAA |BBBBBBB | |AAAA |BBBBBBB | |AAAA |BBBBBBB | +------+BBBBBBBBBB | |BBBBB | |BBBBBBBBBBBBB | +---------------+ 半角スペースの関係で、形が崩れ、申し訳ありません。 過去ログを調べたところ。 http://oshiete1.goo.ne.jp/qa1944867.html に、同様な質問がありました。 そして、 http://allabout.co.jp/internet/hpcreate/closeup/CU20050307A/index2.htm に、一つの解答がありました。 しかし、上記の解答ですと、 Aブロックに背景画像を設定した場合、Aブロックの下には、その背景を表示できません。 Aブロックに背景画像を設定して、その下に同じ背景画像を表示しながら、下をBブロックと揃えることはできないものでしょうか。 やはり、tableを使えば簡単でしょうが、div、floatで、できないものでしょうか。 よろしくお願いいたします。
- rqg2010
- お礼率77% (283/364)
- HTML
- 回答数1
- ありがとう数1
- みんなの回答 (1)
- 専門家の回答
質問者が選んだベストアンサー
ちょっと目的の状態にはならないかもしれないけれどtableを封印するならこんな感じ? <div style="background-image:url('bg.gif')"> <div class="A">AAAA</div> <div class="B">BBBB</div> </div> つまりより外側で背景を指定するという話・・・。 この状態でAの方で height:100% だとうまくAで背景指定しても揃うかもしれないけれど試してないから判らないや・・・
関連するQ&A
- この場合の正規表現を教えてください
AAAA BBBBBBBBBBBBB BBBBBBBBBB... CCCCC DDDDDDDDDDDDDD... AとCの部分の文字列は決まっていて、BとDの部分はどのような文字列か(改行数も含めて)わかりません この場合でのAとCを含むAとCに囲まれたBの部分を正規表現で表すにはどう書けばいいんですか? ↓この部分全体のことです AAAA BBBBBBBBBBBBB BBBBBBBBBB... CCCCC
- 締切済み
- その他(プログラミング・開発)
- CSSで、フレームを使ったようなメニューを作りたいのですが
HP作り初心者です。ただいま、CSSを使用してのHP作りに挑戦中です。 フレームを使ったHPでよく見るような、画面左側にメニュー、右側に本文という構成にしたいと思っています。 下記「All About」記事を参考に作ってはみたものの、 本文が長いのでスクロールするとメニュー部分が見えなくなってしまいます。 メニュー部分が常に画面上に表示されるように固定したいのですが、どうすればよいのでしょうか。 ご教授よろしくお願いします。 使用ソフト:TeraPadで直打ち。 確認ブラウザ:FireFox3.0.13とIE8.0。 CSS:外部ファイル。A.cssにページレイアウト、B.cssにメニュー部分の情報(文字サイズやリンク関連の装飾など)記載。 メニュー:ulとolタグ使用。 All About・CSSで段組構成 段の背景色が切れないようにする(前) ⇒http://allabout.co.jp/internet/hpcreate/closeup/CU20050328A/ All About・CSSで段組構成 段の背景色が切れないようにする(後) ⇒http://allabout.co.jp/internet/hpcreate/closeup/CU20050401A/ All About・CSSで段組構成 隣の段が下に回りこむのを防ぐ ⇒http://allabout.co.jp/internet/hpcreate/closeup/CU20050307A/
- 締切済み
- ホームページ作成ソフト
- 携帯サイトのプルダウンメニューでアンカーへリンク
皆様、そうぞお力をかしてください。 携帯サイト(仮にaaaa.html)でプルダウンメニューでaaaa.htmlの中のアンカーポイントにリンクさせたいのですが、携帯ですのでjavaが使えませんのでフリーのcgiを使い(jump.cgi)ました。aaaa.htmlに下記のようなフォームを入れてみました。 <FORM ACTION="jump.cgi"> <SELECT NAME="jumpto"> <OPTION VALUE="aaaa.html.html#a1">1</OPTION> </SELECT> <INPUT TYPE="submit" VALUE="移動"> </FORM> しかし「not found」になってしまいます。 このaaaa.html.html#a1の#a1をとるとちゃんと表示できるのですが…。 aaaa.html.html#a1のまま実行するとブラウザのURLの末尾がaaaa.htmll%23a1となっています。 http://allabout.co.jp/computer/hpcreate/closeup/CU20020331A/jump.cgi.txt のcgiを使わせていただきました。そして http://allabout.co.jp/computer/hpcreate/closeup/CU20020331A/index2.htm のページを参考にさせていただきました。 解決方法のわかる方どうかアドバイスよろしくお願いいたします★
- ベストアンサー
- HTML
- スタイルシートで段組
<div id="content">content</div> <div id="left">left</div> <div id="right">right</div> <div id="header">header</div> 上記並び順でHTMLソースを記入し、表示方法は下記のようにしたいと考えています。ページ幅は750pxです。 ------------------------- header(width:750px) ------------------------- left(150px) content(450px) right(150px) ------------------------- スタイルシートは普段あまり使ったことがないため、http://allabout.co.jp/internet/hpcreate/closeup/CU20041115A/index2.htm このようなサイトを見ながら勉強しながらやっていますが、わかりません。この場合はどのようにスタイルシートを記述すればいいのか、教えていただけないでしょうか。宜しくお願いします。
- ベストアンサー
- その他(プログラミング・開発)
- CSSで縦三段レイアウトにして、HTML上では真ん中部分を最初に表示
皆様よろしくお願い致します。 http://allabout.co.jp/internet/hpcreate/closeup/CU20041115A/ このように左、中、右で表示させる場合は cssの使い方によってhtmlでは右を一番最初に表示させる事も可能なのは知っているのですが、 seo対策として「上、中、下」のcss縦三段レイアウトで「中」をhtml上では一番最初に表示させたいのですが可能でしょうか?
- ベストアンサー
- CSS
- CGIについて
お忙しいところ、申し訳ないのですがお力をお貸し下さい。ホームページの「Copyright」を自動的に更新できるようにしたいと思い、色々と探しました。「オールアバウト」に説明してある記事【 http://allabout.co.jp/internet/hpcreate/closeup/CU20061101A/index3.htm 】があり、なんとか自力でと試したのですが、書いてある方法がよく理解できません。 初心者でも、実行できるように教えて頂けないでしょうか?宜しくお願いします。
- ベストアンサー
- インターネットビジネス
- ランダムに画像を表示
http://allabout.co.jp/computer/hpcreate/closeup/CU20030721A/index2.htm ↑ここのソースを使ってみたのですが、 画像のところに「×」がでて画像が表示されません。 パスはちゃんと指定してるんですが・・・。 なぜでしょうか?
- ベストアンサー
- HTML
- マージンのマイナスのバグ
http://allabout.co.jp/internet/hpcreate/closeup/CU20060427A/index2.htmでマージンのマイナスをつかったボックスの作り方が載っていますが、エクスプローラーでこの部分をそのまま使ってもボックスのラベルの上の部分が表示されません。FIREFOXではちゃんと表示されているようですが、エクスプローラーでなんとか表示させることはできないでしょうか?
- 締切済み
- HTML
- フレームの下に文字が隠れてしまいます…
横2分割した画面を作っています。 左にはメニューを出すんですが、このメニューは 画像の上にカーソルを合わすと項目が右側に出てくる ポップアップメニュー?です。 --------------------- | AAA | aaaa | --------------------- | bbbbb | ---------- こんな感じでしょうか… フレームの区切り位置をAAAとaaaaの間にすると AAA側でカーソル合わせたときにaaaa側が 右フレームの下に消えてしまいます。 フレームの上に出すことは可能でしょうか? 色々試して、 フレームをまたいで画像を出すことは出来たんですが IEとNN両方対応しないといけないので却下されました… 参考ページでも良いのでよろしくお願いしますm(__)m
- ベストアンサー
- JavaScript
お礼
SAYKAさん、お早うございます。 できました。 ありがとうございました。