- ベストアンサー
表示のしかたがわかりません
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
＞TABLEタグを使わず～ じゃ、スタイルシートでポジション指定ですかね。 基本パターンは↓。 <html> <head> <title></title> <style type="text/css"> <!-- div.left{position:absolute; left:0px;} div.right{position:absolute; right:0px; } --> </style> </head> <body> <div class="left">こんにちは</div> <div class="right">こんばんは</div> </body> </html> お試しを。
その他の回答 (3)
- kmor
- ベストアンサー率27% (225/825)
こんな感じでしょうか。 <DIV style="top : 10px;left : 10px; position : absolute;"> こんにちわ </div> <DIV style="top : 10px;left : 500px; position : absolute;"> こんばんわ </div>
お礼
できましたー どうもありがとうございます。
- strife
- ベストアンサー率53% (112/209)
おはようございます。 一行に右寄せ、左寄せ両方とも作りたいのであれば、一番手っ取り早い方法はTABLEタグを使用することです。（これは好き嫌いが分かれる方法ですが…。） これはTABLEのborderを設定せずにすることにより、表の枠を表示させずにレイアウト枠として使う方法です。 サンプルとして、下のものを試してみてください。 <TABLE width="100%"> <TBODY> <TR> <TD align="left">こんにちは</TD> <TD align="right">こんばんは</TD> </TR> </TBODY> </TABLE> 応用しだいで、いろいろなレイアウトを考えることができます。 ただし、TABLEタグは多用すると重くなるので気をつけてください。 それでは。
補足
早速に回答ありがとうございました。 すみません、TABLEタグを使わず記述したいと考えております。 すみません、説明不足で・・・ TABLEタグをつかわないとやはりむりなんでしょうか？
こんにちは←ここが左端／ここが右端→こんばんは －－のような感じですか。 テーブルを使うと、比較的イメージに近いものができると思います。基本パターンは↓。 <table width="100%"> <tr> <td align="left">こんにちは</td> <td> </td> <td align="right">こんばんは</td> </tr> </table> ご参考まで。
補足
早速に回答ありがとうございました。 すみません、TABLEタグを使わず記述したいと考えております。 すみません、説明不足で・・・
関連するQ&A
- 改行しないようにするには？
<html> <head> <title>test</title> </head> <body> <a href="http://www.yahoo.co.jp/">左</a> <div align="right"><a href="http://www.yahoo.co.jp/">右</a></div> </body> </html> このように、リンクを付けた文字列を右と左に表示させたいのですが 画像のように改行されて表示されます。 同じ行に、二つのリンクを表示するにはどうすればいいですか？ よろしくお願いします。
- ベストアンサー
- HTML
- 《初心者です》HTMLの改行無効化について教えてください。
現在HPを作成中なのですが初心者的質問で 申し訳ないです。お暇な方いらっしゃいましたら 教えてください。 同じ行の中に『右詰め』と『左詰め』を同居（？） させたいのですが、『<DIV ALIGN="LEFT">文字列</DIV> <DIV ALIGN="RIGHT">文字列</DIV>』 このような記述にすると改行されてしまいます。 何か良い手法はないでしょうか？ 宜しくお願いします。
- ベストアンサー
- レンタルサーバ・ASP
- CSS段組み？で右カラムを右寄せにするには？
説明が難しいのですが・・・ テーブルレイアウトでいえば、下記のHTMLで実現できるような表示方法を、 tableタグを使わずに実現したいです。 <table style="width: 100%;"><tr> <td>左パーツ</td> <td style="text-align: right;">右パーツ</td> </tr></table> divタグに float: left; を付けると、２つのdivブロックを横並びに配置できますが、 右側にあるdivにtext-align: right;を付けても、左寄せになってしまいます。 ※width未指定なので当たり前なのですが・・・ ただ、今回の場合は実際にマルチカラムを実現したいわけではなく、 上記コードでいうところの左パーツを画面の左端へ、 そして右パーツを画面の右端に表示させたいだけです。 左右それぞれの横幅は特定していません。 どなたか分かる方、教えて下さい。
- ベストアンサー
- CSS
- リンクを横に並べるには、どうすればいいですか？
リンクを下記のように並べたいのですが、CSSにはなんと記述すればいいでしょうか？ リンク1（中央揃え） リンク2（右揃え） なぜか、下記のようになってしまいます。 リンク1（中央揃えにしたいのに、左揃え状態） リンク2（右揃えになっているけど、改行されてしまう） margineかpaddingで設定するしかないでしょうか？ 文章が見づらくて、すいません。私が記述したHTML・CSSのソースを下記に載せます。 よろしくお願いします。 /*---------- CSS部分（外部スタイルシートに記述） ----------*/ div#inline { display: inline; } div#center { text-align: center; } div#right { text-align: right: } /*---------- HTML部分 ----------*/ <div id="inline"> <div id="center"><a href="～○○">リンク1</a></div> <div id="right"><a href="～○○">リンク2</a></div> </div>
- ベストアンサー
- CSS
- 忍者blogのCSS編集について質問です。
今、プラグインのCSSを編集しています。 テンプレート編集画面のデフォルトの状態でプラグイン部分が HTML(今回必要な部分を抜粋) <div class="PluginContents <!--$plugin_contents_align-->"> <!--$plugin_data--> </div> CSS(今回必要な部分を抜粋) .PluginContents { padding: 10px; } .Plugin_data { text-align:left; padding:5px; } .Plugin_data_date { text-align:right; } となっているサイトをブラウザで表示し、 そこからソースを開くとHTMLが <div class="PluginContents left"> <div class="plugin_data"> <a href="/Entry/n/">プラグインの内容</a> </div> <div class="plugin_data_date">(日付)</div> </div> に変わります。 <!--$plugin_data-->にプラグインの内容と日付が自動挿入されているのだと思います。 ここで、プラグインの内容と(日付)はデフォルトの状態で改行され、 別の行にあります。 『これを改行をなくし同じ行に表示させたいです。』 CSSの知識はあまり深くないのですが、 自分では、display:inline;を双方に挿入したのですがダメでした。 どうすれば内容と日付を同じ行に表示することが可能ですか？ CSSに詳しい方、レンタルブログの構造に詳しい方、お願いします。
- 締切済み
- ブログ
- HTMLでCSSでボーダーが表示されません。
HTMLでCSSでボーダーが表示されません。 右サイドバー（right）の左にボーダーを表示させたいのですが、 画像のように文字を記述したところまでしかボーダーが表示されません。 ボーダーをfooterの上まで引きたいのですが、 わかる方いらっしゃいましたら回答宜しくお願い致します。 ■HTML <html> <body> <div id="wrapper"> <div id="header"></div> <div id="container"> <div id="left"></div> <div id="right"> <div id="right_title"></div> <div id="right_content"></div> </div> </div> <div id="footer"></div> </div> </body> </html> ■CSS #right { float: left; height: auto; } #right_title { } #right_content { border-left-width: 1px; border-left-style: solid; border-left-color: #000; }
- ベストアンサー
- HTML
- DIV 右寄りにしたい
<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja" dir="ltr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>test</title> <style type="text/css"> <!-- div.右, div.左{ background-color: #ffff00; display:inline; border: 1px #BDBDBD solid; padding: 10px 6px; } div.右{ text-align:right; } --> </style> </head> <body> <div class="左"> 左 </div> <div class="右"> 右 </div> </body> </html> 上記のコードで、 一つのDIVは右寄り、もう一つは左寄りにしたいのですが 右寄りの仕方がわかりません。 どうやらdivはtext-align:right;では右に寄らないのですが どうすれば右に寄せられますか？ 右divも左divも同じ位置に左右に表示させたいです。
- ベストアンサー
- HTML
- <SPAN>で文字を右揃えにしたいのですが...(＾-＾；
こんばんは。私は今HPを作っています。 それで質問なんですけど、 HTMLで<SPAN>ってタグありますよね？ それにCSSを使って(? <SPAN>で囲まれた場所を 文字を右揃えに表示させたいのですが、何故かうまくいきません。 <SPAN style="text-align: right">○○</SPAN> このようなタグで使いました(上) 何故なのでしょう、教えてください。 よろしくお願いします。 ちなみに、このようなものをつくりたいのです。(下) リンク集なんですけど； HPタイトル 管理者名 ――――――――――――――― バナー ――――――――――――――― このHPの説明 これの管理者名のところを右揃えに表示したいのだが、 うまくいかないのです；<DIV>だと改行されてしまうし...
- ベストアンサー
- HTML
- 画像を少しだけ左に寄せる方法教えて下さい
ホームページをつくっています。 ある画像を <Div Align="right"><img src='画像URL' border=0></Div> <Div Align="right">画像の下に名前</Div> というタグで表示しましたが、どうも右端にピッタリ行き過ぎてしまいます。大体3～4センチ左に移動して表示するにはどうしたら良いでしょうか? ご教示いただけるとありがたいです。
- ベストアンサー
- その他（インターネット・Webサービス）
- メールフォームの位置 及び 文字の回りこみ
お世話になります。 忍者ホームページにて忍者メールフォームを使用しています。 http://charanporan.xxxxxxxx.jp/bosyuu.html/ メールフォームを設置したところ左側に表示されましたが、右側に表示するには どのようにすれば良いですか？ （試した例⇒ <DIV style="align:right"> ）変化ありませんでした。 また メールフォームが左側に表示されているとき、右側への文字の回りこみ メールフォームが右側に表示されているとき、左側への文字の回りこみ はどのようにすれば良いですか？ （試した例⇒ <DIV style="float: right;"> ）変化ありませんでした。 メールフォーム設置タグ <!--ninja_style_mailform--> <div id="SMFkkk">中略</div> <script type="text/javascript"中略</script> <noscript>中略</noscript> <!--ninja_style_mailform--> 上記がメールフォームタグです。 具体的にどのようにすればよいか教えてください。 よろしくお願いします。
- ベストアンサー
- レンタルサーバ・ASP
お礼
上記で、できました。 すみません、2度も回答いただき・・・m(_ _)m どうもありがとうございました。