• 締切済み

テーブルの1つのセル内で、上揃えの文章と下揃えの文章を書きたい。

quadsの回答

  • quads
  • ベストアンサー率35% (90/257)
回答No.3

今朝から考えていたのですが無理でした。 一般性を考えて隣接セルやそのセルの高さに関わらず上揃え、下揃えが出来るような指定を試みましたが、td要素内の内容物の扱いが特殊なため、普通に考えられるような指定では対応できませんでした。 position height vertical-align 過去モード、準拠モード問わず、モダンブラウザで再現できませんでした。 IEのバグ解釈により、IEのみであるなら再現可能ですが、CSSで構成する意味が無くなってしまいます。 どうしてもというなら、そのセルの高さを弄る必要があります。 しかしながら、セル内でそのような配置は難しいです。

関連するQ&A

  • テーブル内のスタイルシートについて。

    カテゴリHTMLでよいのか、ちょっとビクビクしているのですが。 テーブルのひとつのセル内で左揃えの文字列と右揃えの文字列を作りたいのです。 スタイルシートを使おうと思ったのですが、 それぞれの文字列に <SPAN STYLE="text-align:left;">むにゃむにゃ</SPAN> <SPAN STYLE="text-align:right;">うにょうにょ</SPAN> と指定をしても全く反映されません。 一つのセル内で左右に文字を振ることは不可能なのでしょうか?

    • ベストアンサー
    • HTML
  • ASP.Net テーブルのセル内を上揃えにしたい

    大変お世話になっております。 下記のように、テーブルのセルを2列にして、左右のセルにそれぞれ、GridView を配置しております。 こうすると、どちらかにデータが偏って多く表示されると、反対側のセルのGridView がセルの縦方向のセンターに寄ってしまいます。両方のGridView をデータがいくら入ってもそれぞれのセルの縦方向の上揃えにしたいのですが、どのようにすればよろしいでしょうか? 何卒よろしくお願いいたします。     <table align="center" cellspacing="1" class="style2">       <tr>         <td>           <asp:GridView ID="GridView1" runat="server">           </asp:GridView>         </td>         <td>           <asp:GridView ID="GridView2" runat="server">           <asp:GridView>         </td>       </tr>     </table>

  • 文章をCSSで左揃えにする方法

    趣味でHPをつくっているのですが、 基本左揃えで文章をつくっています。 そこで、文の途中にイメージを真ん中ぞろえで配置したりすると、 それ以降の分が真ん中ぞろえになってしまうので、 すべての文に <p align="left">を指定しています。 しかしそれではすべての文に入力されてしまうので、 とても乱雑なHTMLになってしまいます。 ですので、できればCSSのdivで囲って本文を左揃えに指定したいですが、外部スタイルシートファイルにはどのような記述をすればいいのでしょうか? 自分でやってみたのですが、 どうもうまくいかなくて困っています。 お詳しい方よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • <SPAN>で文字を右揃えにしたいのですが...(^-^;

    こんばんは。私は今HPを作っています。 それで質問なんですけど、 HTMLで<SPAN>ってタグありますよね? それにCSSを使って(? <SPAN>で囲まれた場所を 文字を右揃えに表示させたいのですが、何故かうまくいきません。 <SPAN style="text-align: right">○○</SPAN> このようなタグで使いました(上) 何故なのでしょう、教えてください。 よろしくお願いします。 ちなみに、このようなものをつくりたいのです。(下) リンク集なんですけど; HPタイトル   管理者名 ――――――――――――――― バナー ――――――――――――――― このHPの説明 これの管理者名のところを右揃えに表示したいのだが、 うまくいかないのです;<DIV>だと改行されてしまうし...

    • ベストアンサー
    • HTML
  • tableセル内の長い文章の後半をカットする方法

     Internet Explorerで表示することを前提に、テーブルのセル内にある長すぎる文章は後半を表示しないようにすることで、すべてのセルをウィンドウの横幅以内に収めたい考えています。  以下のスタイルシートを用いたHTML文章の場合、ブラウザで表示するのであれば、こちらの考えているレイアウトで表示されるのですが、このページを印刷するときは、長い文章の後半は改行されて複数行で表示されてしまいます。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <style> table{width:100%;border-collapse:collapse;border-width:2px;border-color:black;border-style:solid;} td{border-width:1px 2px 1px 2px;border-style:solid;border-color:black;} th{border:solid 2px black;padding:2mm;background-color:#F0F0F0;} div.t{font-size:5mm;overflow:hidden;height:5mm;margin:1mm;word-break:break-all;} </style> <body> <table> <tbody><tr><th>0</th><th>1</th><th>2</th><th>3</th><th>4</th></tr></tbody><tbody> <tr><td><div class="t">文章テスト文章テスト文章テスト文章テスト文章テスト文章テスト</div></td><td><div class="t">文章テスト文章テスト文章テスト文章テスト文章テスト文章テスト</div></td><td><div class="t">c</div></td><td><div class="t">d</div></td><td><div class="t">e</div></td></tr></tbody><tbody> <tr><td><div class="t">a</div></td><td><div class="t">b</div></td><td><div class="t">c</div></td><td><div class="t">d</div></td><td><div class="t">e</div></td></tr></tbody></table> </body> </html>  印刷時にもセル内の文章が改行されず、かつ、すべてのセルが用紙の横幅に収まる方法をお教えください。

    • ベストアンサー
    • HTML
  • 【CSS】floatで左右に並べた<div>を下揃えにできますか?

    CSS(スタイルシート)においてfloatで2つのdivを左右に並べる方法は定番ですが、この2つのblockレベル要素は高さが違えば下部が不ぞろいになります。 これは仕方ないとして、上部が不揃いになってもいいので下揃えにできませんでしょうか? text-align:bottom;やvertical-align:bottom;ではできませんでした。tableを使えば可能でしょうが今回はtableなしという事でお願いいたします。

    • ベストアンサー
    • HTML
  • tableについて

    いつもお世話になっております。 今回はテーブルについてお聞きします。 現在、テーブルからマウスが出て行った際にある処理をしたいと思っています。 そこで以下のようにしてみたところ <table onmouseout="function()"> 各セルを移動するごとにこの関数が動いてしまったので、 <div onmouseout="function()"> <table> ... </table> </div> とやってみましたが結果は同様でした。 テーブルを一つの空間として、そこからマウスが出たらfunctionを予備隊のですがこの場合はどのようにすれば実現できるのでしょうか? ご教授願います。

    • ベストアンサー
    • HTML
  • スタイルシートでの中央揃え

    <html> <head> <title>文書のタイトル</title> <meta http-equiv="Content-Style-Type" content="text/css"> <style> body{text-align: center;} </style> </head> <body> <table> <tr> <td> テーブルの内容 </td> </tr> <table> テーブル外の内容 </body> </html> のように、スタイルシートで、 body{text-align: center;} を指定したのですが、IE6ではtableが中央揃えされましたが、NN7.1やFirefox 1.5.0.7ではtableが中央揃えされませんでした。 centerタグを使えば問題ありませんでしたが、非推奨なのであまり使いたくありません。 スタイルシートを用いてIE6と同様にNNやFirefoxでtableを中央揃えするようにするにはどうすればいいでしょうか。

    • ベストアンサー
    • HTML
  • 【HTML/CSS】ブロック内の中央揃え

    HTML初心者です。 tableのセルにリンクを張り、cssで {display:block;} と設定し、セル単位で別ページへリンクできるようにしました。 しかし、blockで設定するとセル内のリンクが中央揃えになりません。 text-alignやvertical-alignを設定しても中央揃えできません。 手をこまねいているのでアドバイスがほしいです。 よろしくお願いします。

  • テーブルの一部分のセルだけにスクロールバーを付けたいのですが、うまくいきません。

    #test1はちゃんとスクロールバーが付くのに、 テーブル内の設定したセルにはスクロールバーが付きません。 tableタグやth,tdタブにも設定したりと色々しましたが、 付きません。 なぜなのでしょうか。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>test page</title> <style type="text/css"> table { background:yellow; } th,td { width:200px; border:solid 1px #000000; overflow:scroll; } #test1 { width:100px; overflow:scroll; } </style> </head> <body> テーブル <br /> <table> <tr> <th>見出し1</th><td>本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文</td> </tr> <tr> <th>見出し2</th><td></td> </tr> <tr> <th>見出し3</th><td>本文</td> </tr> </table> <div id="test1">あああああああああああああああああああああああああああああああああ</div> </body> </html>

    • ベストアンサー
    • HTML