フレーム内のリンクのマージンを解消する方法は?

このQ&Aのポイント
  • フレーム内のリンクのマージンを解消する方法を教えてください。
  • フレーム内に縦に並ぶリンクのバランスを取るために、右側のマージンをなくしたいです。
  • フレームの左側にあるリンクを中央に配置する方法がわかりません。どうすればいいですか?
回答を見る
  • ベストアンサー

フレーム内のリンクの右の大きなマージンをなくしたい。

 画面をフレームで左右に分けまして、左フレームにリンクを10個ほど縦に並べています。  リンク文字に背景色をつけ、更に左右のフレーム内にも別々の背景色をつけています。  リンクは左フレームの中央に置きたいのですが、右側にマージンが出来てしまいバランスが取れません。  色々試してみたのですが、どうしてもうまく行きません。下記にソースコードを記入しました。  どう処理をすれば良いのか、どなたか教えて下さい。  HPの初心者です。どうぞ、よろしくお願いします。 フレーム <frameset cols="19.5%,*" border="0"> <frame src="link.html" > <frame src="index.html"> </frameset> フレームの左側 <style type="text/css"> <!-- .param1 {line-height:2;position:absolute;left:10;} a {text-decoration:none;background-color:#eaffef;} --> </style> <body background="haikei.jpg" link="#0000ff" alink="#ff0000" vlink="#0000ff"> <pre> <br><font size="1%" class="param1"><a href="index.html" target="_top">トップページ   </a>

  • HTML
  • 回答数5
  • ありがとう数4

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

  • ベストアンサー
  • cat_2001
  • ベストアンサー率58% (35/60)
回答No.5

答えを教えちゃうと、勉強にならないのでヒントだけ。 .param1 {line-height:2;position:absolute;left:10;} が、いたずらしています。 こう言うのは、htmlにソースミスが無いかをまず確認し、そこにミスが無ければ、cssが問題だという事になるので、何処が悪いかを一つずつ検証していくと、答えが出てきます。それに慣れてきたら、ソースを全体的に見れば何処が悪いのか、判るようになります。とにかく、おかしな所がでたら、単純化していって消去法で見つける努力をしましょう。 それと、ふと思ったのですが、 ><frameset cols="19.5%,*" border="0"> 左はリンクページなんですよね?なんで19.5%しかとらないんでしょう? ブラウザ上でサイズの変更…は確かにできますが(このままで)、NN4.×は効きませんよ。それにこんなちっちゃくしたら、デフォルトで表示した時、「何でこんなに細いの!?」と思う人100%だと思うのですが…?

taketyan123
質問者

お礼

「position:absolute;left:10;」を削除しましたら、見事、見事に消えました。 それに問題の解決法まで教えていただき、有難うございます。 左リンクページの19.5%は小さいんですね! 分かりました。自分なりに適正な幅を研究してみます。 くさっていたのですが、元気が出ました。有難うございました。

その他の回答 (4)

noname#3345
noname#3345
回答No.4

たぶん、リンク側の全ソースを公開した方がいいと思いますよ。 #2の方と同じ事を私もやってみましたが、おっしゃるようなマージンも出なければ、折り返しされることもありませんでした。 windows2000/IE5.5 環境とブラウザも書き添えた方がいいでしょう。

taketyan123
質問者

お礼

説明不足で、申し訳ありません。 windous98/IE6.0を使っています。 マージンの出る出ないは、OSの違いから来るのかもしれませんね。 この件は、#5の方のご回答で解決しました。 お手数をおかけ致しました。 有難うございました。

  • achuko
  • ベストアンサー率36% (12/33)
回答No.3

こんにちわ 質問をきちんと理解できているか不安ですが リンクを中央に揃えるだけでしたら スタイルシートの.paramの中のleft:10を消して リンクの前にある<pre>をけして <div align="center">を入れて リンクの文字の後の</a>の後ろに</div> リンクがたくさんあるときは全部を <div>で囲えばできると思いますができましたか?

taketyan123
質問者

お礼

ご指示どうりにやってみたのですが、確かにリンク文字は中央に来るものの、今度は左右マージンが出ます。 この問題は、#5の方のご解答で解決しました。 でも、ご親切にご回答頂き有難うございました。

  • megawind
  • ベストアンサー率39% (101/255)
回答No.2

まず質問の意味がよくわからない。それよりもフレームHTMLは元もHTMLファイルが3つ(画面2つ分けの場合)で構成しています。 貴方の場合 1.home.html(これは他所の人がアクセスするページ) 2.link.html(frame左で表示するページ) 3.index.html(frame右で表示するページ) home.htmlの中身は: <HTML> <HEAD><TITLE>HOME</TITLE></HEAD> <frameset cols="30%,*" border="0"> <frame src="link.html" > <frame src="index.html"> </frameset> </html> link.htmlの中身は: <HTML> <HEAD><TITLE>link</TITLE> </HEAD> <style type="text/css"> <!-- .param1 {line-height:2;position:absolute;left:10;} a {text-decoration:none;background-color:#eaffef;} --> </style> <body background="haikei.jpg" link="#0000ff" alink="#ff0000" vlink="#0000ff"> <pre> <br><font size="1%" class="param1"><a href="index.html" target="_top">トップページ </a> </html> index.htmlの中身: <HTML> <HEAD><TITLE>index</TITLE> </HEAD> <H2>INDEX</H2> </html> これでまずやって見て下さい。 上記のソースをそれぞれのファイル名で保存すれば動作するはずです。

taketyan123
質問者

お礼

>まず質問の意味がよくわからない。 説明不足で、申し訳ありません。 その上、フレームの扱い方までご教示頂き、有難うございます。 マージンの問題は、#5の方のご回答で解決致しました。 お手数おかけ致しました。ご親切なご回答有難うございます。

noname#3345
noname#3345
回答No.1

右側のマージンって、スクロールバーの幅分のやつですか? でしたらあれは隠れスクロールバーのようなものになるので、制御不可能だったと思うのですが・・・。

taketyan123
質問者

補足

お早いご回答有難う御座います。 スクロールバーがあっても、やはり右側に1.5CM程度のマージンが出ます。 そこに壁があるようでフレームを縮めると、1.5CM程度のマージを取ったままリンク文字が2行に分解します。

関連するQ&A

  • リンクのターゲット

    htmlを使ってホームページ作成を目指しています。 フレームページにして、topのリンクをクリックすればconに表示されるようにしたいのですが、どうしても別ウインドウで表示されてしまいます。 どこがいけないのでしょうか? どなたかご教授、お願いします。 <HTML> <body> <HEAD> <TITLE>***</TITLE> </HEAD> <frameset cols='15%,*'> <frame src='top' name='top' scrolling='no'> <frame src='con' name='con' scrolling='auto'> </frameset><NOFRAMES> フレーム対応のブラウザでご覧下さい。 </NOFRAMES> </FRAMESET> <body bgcolor=#ffffff text=#000000 link=#0000ff alink=#ff0000 vlink=#ff0000> <a target="_con" href="hajimeni.html">はじめに</a> <body bgcolor=#ffffff text=#000000 link=#0000ff alink=#ff0000 vlink=#ff0000> <center> 今から更新</center> </body> </HTML>

    • ベストアンサー
    • HTML
  • ドリームウィーバー8 フレームへのリンク

    質問です。 ドリームウィーバー8を使って。 3分割したフレーム内 (上top、左left、右main) このように分割しており。フレーム名もそのようにしています。 上top にテキストのリンクを張り 右mainにリンクページを表示したいのですが、どうしても 別ウィンドウが立ち上がり、mainにリンクページが表示されません。 ネットや本で調べて記述どおりにやっていますが どうしても別ウィンドウが立ち上がる状態です。 どなたか、この原因がわかりますでしょうか? <a href="../testHP/public_html/link/Store-introduction.html" target="main">リンクです</a> topフレームのタグはこのように記述してます。 フレーム名も間違っていません。 indexのタグはこうです <title>無題ドキュメント</title> </head> <frameset rows="92,584" cols="*"> <frame src="UntitledFrame-7.html"id="top"/> <frameset rows="*" cols="115,912"> <frame src="UntitledFrame-1.html"id="laft"/> <frame src="UntitledFrame-8.html"id="main"/> </frameset> </frameset> <noframes><body> </body> </noframes></html> これでなにか原因がわかれば。 ご教授お願いします。

  • 曼荼羅3×3の9フレームの作り方

    ホーム頁作成ソフトでは3フレームまでしか有りませんでした。 <FRAMESET rows=*,* frameBorder=yes> <FRAME name=top src="Mandara02.files/page002.html"> <FRAMESET frameBorder=yes cols=*,*> <FRAME name=lbottom src="Mandara02.files/page003.html"> <FRAME name=rbottom src="Mandara02.files/page004.html"> </FRAMESET><NOFRAMES> <BODY bgcolor=#ffffff text=#000000 link=#0000ff vlink=#800080 alink=#ff0000> <A name="_pageHead"></A> <TABLE align="center" border="0" width="640" cellpadding="0" cellspacing="0"> <TBODY> <TR align="left" valign="top"> <TD align="left" valign="top" width="640" nowrap> </TD> </TR> このHTML記述のようなもので9フレームの作り方をご指導ください 参考書は持っていますが理解出来ていません。

  • フレームの境界線

    ホームページでフレームのページを作りました。 フレームの境界線を消したくて、 <frameset cols="150,*" frameborder=0> <frame src="menu1.html" name="menu"> <frame src="top.html" name="main"> </frameset> としても、背景が紫(#CC99FF)なので 白い境目が出来てしまいます。 宜しければ、境目を見えなくする方法を教えて下さい。

    • ベストアンサー
    • HTML
  • HTMLでフレームから隣のフレームにリンクすると別窓になる

    タイトル通り、どうやっても別窓になってしまうんです;;; 今の状況です↓ <html> <head> <title>MAIN</title> </head> <frameset cols="290,65%" bordercolor="#ffff55" frameborder="1" framespacing="1"> <frame src="menu.html"  name="menu" scrolling="yes"> <frame src="top.html"  name="top" scrolling="yes"> </frameset> </html> ↑これがmain.htmlです <html> <head> <title>MENU</title> </head> <body> <frame src="main.html" name="main"> <a href="top.html" target="top.html">TOP</a> <a href="about.html" target="top.html">ABOUT</a> <a href="gallry.html" target="_blank">GALLRY</a> <a href="memo.html" target="top.html">MEMO</a> <a href="link.html" target="top.html">LINK</a> <a href="index.html" target="_top">ENTER</a> </body> </html> ↑こっちがmenu.htmlです ショートカットは、main.htmlとmenu.html(左側)とtop.html(右側)を用意してあります まだ初心者なのでタグがごちゃごちゃしてて分かりづらいかもしれないですが((汗 どうすればtopの方に表示されるのでしょうか??

  • フレームを使って細いメニューを作りたいです。

    フレームを使って細いメニューを作りたいです。 フレームを使って下のほうに細いメニューを表示したいと思っています。 しかし文字の上に一行分くらいの隙間が開いてしまい、 メニューの文字がスクロールしないと表示されません。 メニューの作り方も調べましたが、ここまで細いものについてはわかりませんでした。 どうしたら上手く表示できるでしょうか。 完成ページ↓ <html> <head> <title></title> </head> <frameset rows="*,3%" frameborder="NO" border="0"> <frame src="PageTop.html"> <frame src="Menu.html" noresize scrolling="NO"> <norames><P>このページを表示するには、フレームをサポートしているブラウザが必要です。</P> </frameset> </html> PageTop.html↓ <html> <head> <title></title> </head> <body></body> </html> Menu.html↓ <html> <head> <title></title> <style type="text/css"> <!-- p { text-decoration: none; } --> </style> </head> <p> <body bgcolor="#696969" link="#696969" alink="#696969" vlink="#696969"> <font face="Kartika"><div style="font size:20px;">    <target="1" href="">Top</a>     <target="1" href="">About</a>    <target="1" href="">Main</a>    <target="1" href="">Blog</a>    <target="1" href="">Link</a>    <target="_top" href="">Index</a> </font></p> </body> </html> 至らない点がありましたらご指摘ください。 よろしくお願い致します。

    • ベストアンサー
    • HTML
  • 右側のフレームを上にするには?

    <html> <head> <title>フレーム</title> </head> <frameset rows="100,*"> <frame src="about.html"> <frameset cols="*,500"> <frame src="link.html"> <frame src="img/index.html"> </frameset> <noframes> <body> 未対応ブラウザ向け内容</body> </noframes> </frameset> </html> --------------------------------- コレでは右フレームが上フレームより下になっているんです。 どうすれば右が上(に重ねている)になりますか??

  • 【html】フレーム内の下端に画像を配置したい。

    【html】フレーム内の下端に画像を配置したい。 htmlのframesetで上下に区切ったページを作っていて、上フレーム内の下端に画像を配置したいのですが、どうすればよいでしょうか? menu.htmlとtop.htmlを、index.htmlでまとめており、上フレームはmenu.htmlです。 ソースは以下の通りです。 (1)index.html <html> <head> <title>mntns</title> </head> <frameset rows="110,*" frameborder="0" framespacing="0" border="0"> <frame src="menu.html" name="menu"> <frame src="top.html" name="main"> </framese> </html> (2)menu.html <html> <head> <title>mntns</title> </head> <style type="text/css"> body { color: #8b4513; background: #ffffff; font-size: 8pt; font-family: Verdana,Osaka,'MS UI Gothic'; } </style> </head> <body> <center> <table border=0 cellpadding=0 cellspacing=0 width=0> <td> <a href="top.html" target="main"> <img src="image/top.jpg" border=0 hspace=0></a> </td> </table> </center> </body> </html> このソース内のどこかに配置を指定するのは、どのようにhtmlを書けばよいのか教えてください。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • html リンクを別フレームに表示したい

    htmlでリンク先を別フレームに表示したいです。 今は、縦にフレームを2つ作っていて、本当は左側の文字をクリックしたら右側に表示されるようにしたいのですが、別枠のウィンドウが開いてしまいます。 どこがいけないのでしょうか… このページ以外で編集する必要がありますか? http://noula.himegimi.jp/ 左枠 <html> <head> </head> <body bgcolor="#fff0f5" text="#fa8072"> <font size="2"> <a href="toppage.html" target="left">TOP</a><br> <a href="about.html" target="left">ABOUT</a><br> PROFILE<br> WHAT'S NEW<br> VOICE<br> SONG<br> BLOG<br> WORK<br> LINK<br> CONTACT</font><br> </body> </html> フレーム設定 <html> <frameset cols="10%,*" frameborder="no"> <frame name="right" src="menu.html"> <frame name="left" src="toppage.html"> </frameset> </html> よろしくお願いします

  • フレームへのリンク

    フレームのあるページへリンクを貼りたいのですが、 たいていリンクを貼るとトップページですよね、それをリンクで飛んできたときに違うページにしたいのですが可能ですか。 たいていは index.htmlの中に <IFRAME src="00.html" name="000"></IFRAME> となっていたときindexに飛ぶと フレームには00.htmlが見えますよね。 そうではなく01.htmlを最初から見せる方法はあるのですか。 普通に来た方には00.html サイト内のリンクの場合01.htmとしたいです。

専門家に質問してみよう