• 締切済み

フレームを使った縦横中央へのレイアウト

縦横ともに画面中央にレイアウトするには、どのような方法が良いのでしょうか? http://www.salon-de.net/main.html このサイトではテーブルを縦横100%にしてセルで中央にレイアウトされるように指定しているようですが、テーブル縦100%を認識しないブラウザでは中央レイアウトになりません。 http://www.parkhyatttokyo.com/ このサイトでは、なぜかフレームを縦2段で100%と相対に指定し、100%の方に内容の入ったHTMLファイルを表示させています。 画面中央にレイアウトされたページでは、このようにフレームを縦2段にして100%と相対に指定したものが多く見受けられますが、これにはどのような意味があるのでしょうか? さらに、 http://www.toraya-cafe.co.jp/ では同様のフレームが2重になっています。 また、なぜか「TD」タグ内では「vAlign=center」「align=middle」のようにダブルクォーテーションを付けない書き方が多数派となっています。 この理由はなぜでしょうか? 詳しい方お教え願います。

  • HTML
  • 回答数2
  • ありがとう数1

みんなの回答

  • randman
  • ベストアンサー率51% (17/33)
回答No.2

最良の答えは常にひとつ。 <TABLE border="0" cellpadding="0" cellspacing="0" width="100%" height="100%"> <TR> <TD align="center" valign="middle"> ここにコンテンツが入ります。 </TD> </TR> </TABLE> 縦100%に対応していないブラウザ、私は知りません。 あったとしても、サイト案の段階で切り捨てます。 古くても旧NNに対応していれば、文句を言うユーザもいませんから。 あと、質問と質問名からは、テーブルを使えば良いのか、フレームを使えば良いのかがわかりません。フレームを使うのなら、先のテーブルにIFRAMEを入れるか、定石通りページを5分割する方法をとれば良いでしょう。これなら縦100%に対応していないブラウザでもOKかな? >なぜかフレームを縦2段で100%と相対に指定し~ 100%でないページは、 ・JavaScriptの変数や、カウンタ用のCGIを入れたりするため。 ・アドレスバーにドメイン名のみを表示するため。あるいは、トップページをブックマークさせるため。 たいてい後者です。 >なぜか「TD」タグ内では~ こういったコードは人が書いたものではありません。 おばかなジェネレータ(DreamWeaverなど)が吐き出したものです。 よって、気にすることはありません。「valign="middle"」などときちんと書けば良いのです。 コードはシンプルに。頭で正しいと思えば、たぶん、それが正解です。

  • moon_night
  • ベストアンサー率32% (598/1831)
回答No.1

>縦横ともに画面中央にレイアウトするには、どのような方法が良いのでしょうか? いろいろなサイトを周ってみてよさげなところからソースを引っ張ってくるのが簡単で手っ取り早いと思われます。 >テーブル縦100%を認識しないブラウザでは中央レイアウトになりません。 想定ブラウザにあわせたサイト作りをすればよろしいと思います。 >なぜかフレームを縦2段で100%と相対に指定し これは表示してみれば分かるのですが、フレームで分けると、横のスクロールバーを消すことができます。 スクロールバーが表示されるのを嫌ったのでしょう。 >また、なぜか「TD」タグ内では「vAlign=center」「align=middle」のようにダブルクォーテーションを付けない書き方が多数派となっています。 この理由はなぜでしょうか? たまたま多数見かけただけとは思いますが。 基本的に半角の英数字ならば普通に動くからクウォーテーションをつける手間を省いたのではないでしょうか。 多分「動けばいいじゃん」的な考えでしょう。。

関連するQ&A

  • 画像の上下中央固定について

    今、ホームページをメモ帳で作っています。 大きな画像1枚だけを、1つのページにドンと置いているんですが その画像を、どんなに画面の大きさが変わっても 常に上下左右の中央にもってきたいんです。 左右は、<center>ではさんだり、テーブルを使ったりして できたんですが、どうしても上下だけができません。 どこかのホームページで、テーブルを使った場合 ALIGN="*"と同じように VALIGN="*"でcenterと指定すればできる と書いてあったのですが、私はできませんでした。 どうすれば、上下の中央に持ってこれるのかご存知の方、教えてください。 お願いします。 

    • ベストアンサー
    • HTML
  • Flash画像の中央表示

    ただいまHPを作成しているのですが、例えばSWFなどの画像を メインフレームの横中央は中央合わせで簡単にできるのですが 縦位置の中央は指定できないのでしょうか? ウィンドウサイズを変えても縦横中央にswf書類を表示させたいのです。 jpgなどもそのように表示させたいのですが、縦位置での中央の指定のやり方がわかりません。 どうぞよろしくお願いいたしますm(__)m

  • DreamweaverMX2004でのテーブルの縦横中央配置について

    失礼します。 以前、Dreamweaver MXを使っていて、縦横100%のテーブルの中に中央配置したテーブルを置くことによって、ブラウザ上でのHPの中央配置が可能だったのですが、MX 2004にしてから、同じように作業をしても左右は中央配置になるのですが、縦だけがどうしても上詰め配置になってしまします。 これはMX 2004のバグなのでしょうか? もしこれを解決する方法があれば、教えてください。よろしくお願いいたします。 ちなみに7.01のアップデータもあててあります。

    • ベストアンサー
    • CSS
  • レイヤーを画面の中央に配置したい

    新規Webサイトをつくるにあたって、レイアウトに、テーブルではなく、レイヤーを使用しようと思っています。 画面の中央に配置したい場合、テーブルならalign="center"で、できますが、レイヤーの場合はどのように設定すればよいでしょうか? 当方Dreanweaverを使用しています。HTMLやCSSの書き方でお教えいただいても結構です。 よろしくお願いいたします。

  • Dreamweaver MX 2004でのテーブルの縦横中央配置について

    失礼します。 以前、Dreamweaver MXを使っていて、縦横100%のテーブルの中に中央配置したテーブルを置くことによって、ブラウザ上でのHPの中央配置が可能だったのですが、MX 2004にしてから、同じように作業をしても左右は中央配置になるのですが、縦だけがどうしても上詰め配置になってしまします。 これはMX 2004のバグなのでしょうか? もしこれを解決する方法があれば、教えてください。よろしくお願いいたします。 ちなみに7.01のアップデータもあててあります。

  • swf書類をSAFARIで縦位置中央表示

    swf書類をSAFARIで縦位置中央表示ができません。 <TD align="center" valign="middle">で指定しているのですが 縦のほうが無効となってしまい、上部に行ってしまいます。 SAFARIでswfなどをページの縦横ど真ん中に配置する方法を教えてください。 よろしくお願いいたします!

  • 画像を画面中央配置したいのですが、

    画像を画面中央配置したいのですが、 ネットで検索していて、テーブルレイアウトが一番単純な作りのようなので試してみました。 左右中央にはなるのですが、上下中央に表示されません。 単純に↓が間違っているだけなのでしょうか? <body> <table border=0 width=100% height=100%> <tr><td align=center valign=middle> <img src="images/intro.jpg" /> </td></tr> </table> </body> ご存知の方いらっしゃいましたら、よろしくお願いします。 ーーーーーーーーーーーーーーーーー 作業環境 ・Mac OSX 10.6 仕様アプリ ・Dreamweaver 確認ブラウザ ・Safari 5.0 ・Firefox 3.6.6 ・Opera 9.20 ーーーーーーーーーーーーーーーーー

    • ベストアンサー
    • HTML
  • テーブル?フレーム?

    geocitiesを利用しています。 ホームページビルダーを利用して、今までページを作っていました。 質問です。 よく、素材サイトなどのページで、 フレームで言うと縦3列に並んでいて、中央だけが表示されているような状態のサイトや、 (両端のフレームにあたるところはつねに空白) 画面中央に縦の長四角のスペースがあり、 そこだけが画面として変化するサイトがあります。 あのように、全面が表示されないページを作りたいのですが、 テーブルやフレームなどをあまり利用した事がありません。 どのような処理、タグを使うと、あのようになるのでしょうか。(説明しにくいので、補足はいたします) また、トップページが全画面でも、 子画面が開き、ブラウザボタンなどがつかえないような、 大きさが固定されたページがでるサイトもあります。 前者よりこちらのほうが簡単であれば、こういった形式でもいいな、と思っています。 とにかく初心者で、ビルダーで作ってきたので、 説明が下手なのですが、 わからない部分は補足させていただきますので(本日中には必ずレスが返せる体制です) よろしくお願いいたします。 FTPなどでアップするのではなく、ブラウザ上からアップしているので、フレームを利用する際にも、いちいちフレームのページを1・2・3、などとアップしています。 (もしかしたら方法を知らないだけかもしれません) 「こんな感じで検索すればわかる」というご意見でもいただけると嬉しいです。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • CSSで高さ100%のレイアウト

    テーブルを使用せずCSSでのレイアウトなのですが フッター位置をブラウザの一番下にマージン無しで指定したいのですが出来ません。 テーブルでは <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td valign="top">内容</td> </tr> <tr> <td valign="bottom">フッター</td> </tr> </table> というように指定していたのですが CSSでのレイアウトはHTMLを <div id="container"> <div class="content">内容</div> <div id="footer">フッター</div> </div> .CSS では #container { height: 100%; } は無効なのでしょうか? 他のやり方でもフッターをブラウザの一番下にマージン無しでレイアウトできる方法があったら教えて下さい。

    • ベストアンサー
    • CSS
  • 【助けて!】MovableType3カラムで中央カラムのレイアウトが崩れる

    MovableTypeで3カラムのブログを作っていますが、 ブラウザ一杯にして見ると問題ないですが、 ブラウザを縮めるうちに中央カラムだけが下に落ちてレイアウトが崩れます。 崩れないようにしたいのですがどうすればよいでしょうか? ちなみに中央カラムには「テーブル」でレイアウトを整えています。 --- 例えば下のサイトはブラウザ伸縮しても崩れません、 何とかこんな風にしたいのです! http://e-words.jp/ http://www.harakiri-style.com/mybubble/

専門家に質問してみよう