左右一杯に広がったままページを伸縮する方法とは?

このQ&Aのポイント
  • 左右にページ一杯のまま、伸縮しない方法について教えてください。
  • このタグを使ってページを伸縮させる際、左右一杯に広がったままにする方法を教えてください。
  • ページの伸縮時に左右一杯に広がったままにする方法について詳しく教えてください。
回答を見る
  • ベストアンサー

このタグですが、左右一杯に広がったまま、左方向にページを伸縮しても

このタグですが、左右一杯に広がったまま、左方向にページをちじめても、左右にページ一杯のまま、伸縮するようになりませんか? <BODY> <DIV style="top : 0px;left : 0px; position : absolute; z-index : 1; " id="Layer1"> <DIV> <TABLE> <TBODY> <TR> <TD bgcolor="#ffcccc" height="130" width="750"></TD> </TR> </TBODY> </TABLE> </DIV> </DIV> <DIV style="top : 41px;left : 151px; position : absolute; z-index : 2; width : 397px; height : 43px; " id="Layer2" align="center"><FONT size="+3">テキスト</FONT></DIV> </BODY>

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

質問者が選んだベストアンサー

  • ベストアンサー
  • selene_pl
  • ベストアンサー率49% (102/207)
回答No.1

こんな感じですか? ネスケ4.xだと、かなり見栄えが違うと思われますが。(未確認) <body> <p style=" width:100%; height:10%; background-color:#ffcccc; text-align:center; padding:4%; font-size:150%;"> てきすと。 </p> </body>

関連するQ&A

  • Layerの中にあるリンクがmacで動作しません

    以下が友達に質問されたソースを簡略化した物です。layerを左右2段組みにしてますが、右のlayer内が全く反応しません。layerを使わなければできるのですが、この方法のどこが間違っているかが教えられなくて質問しました。よろしくお願い致します。 javascript~window.open省略 <DIV style="top : 61px; left : 356px; position : absolute; z-index : 1; width: 331px; height: 40px;" id="Layer2"> <DIV> <TABLE border="1" width="331" height="40"> <TBODY> <TR> <TD width="61" height="20">サンプル2</TD> <TD width="214"><A href="#">◆</A></TD> </TR> </TBODY> </TABLE> </DIV> </DIV> <DIV style="top : 61px;left : 24px; position : absolute; z-index : 3; " id="Layer5"> <DIV> <TABLE border="1" width="313" height="40"> <TBODY> <TR> <TD width="134" height="16">サンプル</TD> <TD width="141"><A href="#">◆</A> </TD> </TR> </TBODY> </TABLE> </DIV> </DIV>

    • ベストアンサー
    • HTML
  • このタグですが、ページを右端から左へ縮めても、常に中央に位置させたいのですが、、

    このタグですが、ページを右端から左へ縮めても、常に中央に位置させたいのですが、、、 <BODY> <DIV style="top : 56px;left : 95px; position : absolute; z-index : 1; width : 336px; height : 21px; " id="Layer1" align="center"><FONT size="+4">テキスト</FONT></DIV> </BODY>

    • ベストアンサー
    • HTML
  • センタリングのHTMLの挿入場所

    お世話になっております。 前回の質問の追加をしようとしたのですが、うまくできず、新たにスレッドを立てました。すみません。 以下のHTMLは横並びに写真を載せたもの(数行あります)です。(上部に文章を載せるための式がありますが、カットしています。)このプログラムのどこにセンタリングの式を入れたらいいのか、私の知識ではわかりませんでした。またご教示もらえると助かります。 よろしくお願いします。 </DIV> <DIV style="top : 1313px; </DIV> <DIV style="top : 1473px;left : 327px; position : absolute; z-index : 3; " id="Layer8"><IMG src="button2.gif" width="81" height="35" border="0" alt="Back"></DIV> <DIV style="top : 1060px;left : 21px; position : absolute; z-index : 8; width : 698px; height : 123px; " id="Layer6">&nbsp;  <IMG src="DSC_19711.jpg" border="0" width="160" height="106"> <IMG src="DSC_20401.jpg" border="0" width="160" height="106"> <IMG src="DSC_20541.jpg" border="0" width="160" height="106"> <IMG src="DSC_21231.jpg" border="0" width="160" height="106"></DIV> <DIV style="top : 883px;left : 15px; position : absolute; z-index : 7; width : 649px; height : 165px; " id="Layer5">&nbsp;   <IMG src="DSC_19311.jpg" border="0" width="160" height="106"> <IMG src="DSC_19381.jpg" border="0" width="160" height="106"> <IMG src="DSC_19411.jpg" border="0" width="99" height="149"> <IMG src="DSC_19631.jpg" border="0" width="160" height="106"></DIV> <DIV style="top : 572px;left : -3px; position : absolute; z-index : 5; " id="Layer3"> <DIV> <TABLE border="0" cellpadding="15" width="725" height="147"> <TBODY> <TR> <TD height="113" width="549" align="center" style="position : relative;table-layout : auto;">&nbsp;   <IMG src="DSC_17481.jpg" border="0" width="160" height="106"> <IMG src="DSC_18051.jpg" border="0" width="160" height="106"> <IMG src="DSC_18151.jpg" border="0" width="160" height="106"> <IMG src="DSC_18351.jpg" border="0" width="160" height="106"></TD> </TR> </TBODY> </TABLE> </DIV> </DIV> <DIV style="top : 729px;left : 12px; position : absolute; z-index : 6; " id="Layer4"> <DIV> <TABLE border="0" cellpadding="15" width="725" height="147"> <TBODY> <TR> <TD height="113" width="549" align="center" style="position : relative;table-layout : auto;">&nbsp;<IMG src="DSC_18421.jpg" border="0" width="160" height="106"> <IMG src="DSC_18641.jpg" border="0" width="160" height="106"> <IMG src="DSC_18941.jpg" border="0" width="160" height="106"> <IMG src="DSC_19201.jpg" border="0" width="160" height="106"></TD> </TR> </TBODY> </TABLE> </DIV> </DIV> </BODY>

  • タグの修正に力をかしてください

    ホットペッパーに出てくるお店のページのバナーのように、 「アクセス」「TEL」の文字を表示させたいのですがうまくいきません。 タグの修正にちからをかしていただけないでしょうか。 以下、タグです。よろしくおねがいします。 <table width="702" border="0" cellspacing="0" cellpadding="0"> <tr> <td class="color3" colspan="3"><img src="images/spacer.gif" alt="" width="1" height="1"></td> </tr> <tr> <td class="color3"><img src="images/spacer.gif" alt="" width="1" height="1"></td> <div style="position:relative;"><img src="images/hotpot_bannar.gif" alt="バナー" width="700" height="151"></div> <div style="position:absolute; top:70px; left:400px; color:#ffffff; font-size:10px; border:solid 1px; padding:2px;">アクセス</div> <div style="position:absolute; top:50px; left:450px; color:#ffffff; font-size:10px;>JR環状線:「福島駅」・・・</div> <div style="position:absolute; top:70px; left:450px; color:#ffffff; font-size:10px;>JR東西線:「新福島駅」・・・</div> <div style="position:absolute; top:120px; left:400px; color:#ffffff; font-size:10px; border:solid 1px; padding:2px;">TEL</div> <div style="position:absolute; top:120px; left:450px; color:#ffffff; font-size:10px;>06-****-****</div> <td class="color3"><img src="images/spacer.gif" alt="" width="1" height="1"></td> </tr> </table>

    • ベストアンサー
    • HTML
  • テーブルを真ん中に持ってきたいだけなんです。

    ホームページビルダー7を使っています。 テーブルをウィンドウサイズに合わせて自動的に真ん中に位置されるようにしたいのです。 ネット検索や教えてgooも検索し、align="center"と入れたり、<CENTER></CENTER>でくくってみたりしてみましたが、思うように動作しません。ホームページビルダー上でソースを編集すると、なんか余計なDIVをつけられたりして、わけわかりません。 frontpage expressで作っていたときは、ソースなんて意識しなくてもできたのですが・・・。 ソースの修正でも、ホームページビルダーの機能ででもいいのですが、やり方を教えて下さい。 現在のソースは以下になります。今日一日、これに悩まされてます。 過去の質問を参考にしてもうまくいかなかったので、新規であげさせていただきました。よろしくお願いします。 <BODY bgcolor="#E8F8FF"> <DIV style="width : 580px;height : 106px;top : 99px;left : 82px; position : absolute; z-index : 1; " id="Layer2"> <DIV align="center"> <TABLE border="1" width="580" height="106"> <TBODY> <TR> <TD><FONT size="-1">サブタイトル<BR> <BR> 本文</FONT></TD> </TR> </TBODY> </TABLE> </DIV> </DIV> </BODY>

    • ベストアンサー
    • HTML
  • operaだとテーブルがなくなります

    operaだテーブルがなくなります IEだと問題なく表示されるのに だれか助けてください style.css    body{background-color:#ffff99;margin:0px; font-size:large; font-family:"HG正楷書体-PRO","HG行書体","HGP行書体",cursive} .cur{font-family:cursive} .ser{font-family:serif} } table{background-color:#ff9933;  width:100%; height:10%    }   .midori{background-color:#999933; width:100%; height:3.3%  }        htmlのほうは <HTML> <HEAD> <TITLE></TITLE> <link href="style.css" rel="stylesheet" type="text/css"> </HEAD> <BODY> <table><tr ><td></td></tr></table> <table class="midori"> <tr ><td></td></tr></table> <table style="height:6.7%"> <tr ><td></td></tr></table> <table style="position:absolute; left: 0px; bottom:8%; width:8%; height:100%; background-color:#993300"> <tr ><td></td></tr></table> <table style="position:absolute; bottom:0; height=8% " class="midori"> <tr ><td></td></tr></table> </BODY> </HTML> こんな感じなのですが どうしてでしょうか

    • ベストアンサー
    • HTML
  • tableでレイアウトが崩れる場合

    技術の足りなさからCSSにできなかったので、再度テーブルでサイズを指定してやってみようとしているところです。 どこかの数字がおかしくなっていると思うのですが、どうしてもわかりません。 ちゃんと表示できるブラウザとそうでないブラウザがあり、Firefoxは環境設定により表示が崩れる場合があります。 使用ソフトはビルダーの11です。 なんでも良いのでどうぞアドバイスをよろしくお願い致します。 <body> <div ALIGN="center"> <table> <tbody> <tr> <td CLASS="td4" HEIGHT="70"> <table WIDTH="600" CELLSPACING="1" CELLPADDING="0"> <tbody> <tr> <td VALIGN="top" CLASS="td1" WIDTH="400" ALIGN="left" HEIGHT="180"> <b>文字 <textarea ROWS="15" COLS="70">文字</textarea><br> <br> </td> <td VALIGN="top" CLASS="td1" WIDTH="100" HEIGHT="180"> <table CELLSPACING="0" CELLPADDING="4"> <tbody> <tr> <td CLASS="td2" HEIGHT="16" WIDTH="100">文字</td> </tr> </tbody> </table> 文字 <br> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> <br> </div> </body>

    • ベストアンサー
    • HTML
  • タグについて 音楽箇所の削除

    すみません。タグの初級レベルをご指導下さい。 以下のタグの中で音楽が出る箇所を削除をしたいのですが、 どこのタグ、どこからどこまでを削除すればよろしいでしょうか。 _________________ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 12.0.0.0 for Windows"> <title>○○○ Top logo</title> <meta name="description" content="公式ホームページ"> <meta name="keywords" content="○○○"> <link rel="stylesheet" href="Stylesheet/Body_Stylec.css" type="text/css"> <link rel="stylesheet" href="Stylesheet/Table_TD_clear.css" type="text/css"> </head> <body style="margin-top : 0px;margin-left : 10px;margin-right : 0px;margin-bottom : 0px;"> <div style="width : 100px;height : 10px;top : 91px;left : 134px; position : absolute; z-index : 3; visibility : visible; " id="Layer3"><embed src="MIDI/Shout.mp3" height="19" width="99" autostart="true" loop="true" repeat="true" type="audio/mp3"></div> <div style="width : 411px;height : 56px;top : 1px;left : 285px; position : absolute; z-index : 2; visibility : visible; " id="Layer2"><img src="logo/kl_senior1.gif" width="372" height="59" border="0"></div> <div style="width : 434px;height : 18px;top : 73px;left : 272px; position : absolute; z-index : 1; visibility : visible; " id="Layer1">2009年度スローガン<font color="#ff0000" size="+1">『</font><font color="#ff0000" face="HG丸ゴシックM-PRO" size="+1" style="font-size : 14px;font-weight : bold;">スピーディー</font><font color="#ff0000" size="+1">』</font></div> <table border="1" width="855" cellspacing="0" cellpadding="2" style="margin-top : 5px;margin-left : 10px;margin-right : 0px;margin-bottom : 0px;"> <tbody> <tr> <td width="98" height="87"><img src="logo/logo_littleseniors_l.jpg" width="80" height="80" border="0"></td> <td width="153" height="87">更新のトッピング<br> <img src="logo/NEW-3.jpg" width="37" height="28" border="0" style="vertical-align : super;"><br> <font color="#000000">○○○○</font><font color="#ff0000"><br> </font></td> <td style="text-align : center;" align="center" width="419" height="87"><br> <br> <br> <br> <br> </td> <td align="center" style="text-align : center;" width="169" height="87">○○○ <a href="rirki.html" target="_blank">更新履歴</a><img src="logo/NEW-3.jpg" width="57" height="37" border="0"><br> </td> </tr> </tbody> </table> </body> _________ よろしくお願いします。

    • ベストアンサー
    • HTML
  • タグに直接書き込むスタイルシートを、外部あるいはページ内にわけるには?

    下記テンプレートソースですが、タグに直接書き込むスタイルシートになっています。 このソースを、外部あるいはhead内に設定するには、どういうわけ方をしたらいいですか? いろいろ自分で試したのですが、うまく表示されません宜しくお願いします。 <table><tbody><tr><td> <div style="border:1px solid #ff6699;background:#ffcccc;font-size:13px"><div style="padding:3px" align="center"> * ここにタイトル * </div><div style="border-top:1px solid #ff6699;background:#fff;padding:10px" align="left"> * ここに本文 * </div></div> </td></tr></tbody></table>

    • ベストアンサー
    • HTML
  • CSSのdivで、ページ全体をセンタリング出来ない

    質問させて頂きます。 <style type="text/css"> #contena { margin-right: 10px; margin-left: 10px; text-align: center; height: 900px; width: 950px; } </style></head> というように、全体をdivで囲んだにもかかわらず、何故かセンタリング出来ません。 最も簡単に、このページをセンタリングするには、どうすればよいでしょうか? ホームページビルダーで「どこでも配置モード」で作ったものを、dreamweaverで作り直す場合に該当します。 下記にHTMLを記載しておきます。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta name="IBM:HPB-Input-Mode" content="mode/flm; pagewidth=750; pageheight=900"> <meta name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 14.0.8.0 for Windows"> <title>タイトル</title> <style type="text/css"> #contena { margin-right: 10px; margin-left: 10px; text-align: center; height: 900px; width: 950px; } </style></head> <body background="blue_p7b.gif"> <div id="contena"> <div style="top : 0px;left : 20px; position : absolute; z-index : 20; " id="Layer22"><img src="anim.gif" width="373" height="93" border="0" alt="ようこそ"></div> <div style="top : 18px;left : 575px; position : absolute; z-index : 2; " id="Layer4"><a href="http://www.dodgeball.or.jp/"><img src="jdba1.gif" border="0" width="106" height="30"></a></div> <div style="top : 60px;left : 143px; position : absolute; z-index : 1; " id="Layer1"><img src="logo111.gif" width="488" height="69" border="0" alt="リンク"></div> <div style="top : 219px;left : 317px; position : absolute; z-index : 27; width : 580px; height : 51px; " id="Layer28"> <p><font color="#0000ff" size="+2">コンテンツ</font></p> </div> <div style="top : 161px;left : 647px; position : absolute; z-index : 22; " id="Layer23"></div> <div style="top : 255px;left : 284px; position : absolute; z-index : 28; " id="Layer2"><img src="frendlyindx.gif" width="546" height="410" border="0"></div> <div style="top : 216px;left : 652px; position : absolute; z-index : 23; " id="Layer24"></div> <div style="top : 304px;left : 50px; position : absolute; z-index : 26; " id="Layer27"></div> <div style="top : 754px;left : 47px; position : absolute; z-index : 19; width : 707px; height : 154px; " id="Layer21"><iframe frameborder="1" src="saishijoho.html" width="709" height="150" scrolling="AUTO"></iframe></div> <div style="top : 953px;left : 40px; position : absolute; z-index : 7; " id="Layer9"><a href="taikaikekka.html"><img src="button41.gif" width="57" height="54" border="0" alt=" "></a></div> <div style="top : 659px;left : 48px; position : absolute; z-index : 6; " id="Layer8"><img src="logo1.gif" width="194" height="65" border="0" alt="最新情報 "></div> <div style="top : 1020px;left : 34px; position : absolute; z-index : 12; </div> </body> </html> 詳しい方がいましたら、よろしくお願いします。

専門家に質問してみよう