テーブルで幅を固定した場合に、アルファベットの文字を続けて入れると、
それが改行されず、横に終わるまで続き、結果、固定した幅を無視した
状態で表示されてしまいます。
たとえば「aaaaaaaaaaaaaaaa」とう文字を入れた場合でも、
幅が固定されていれば自動的に
aaa
aaa
aaa
aaa
aaa
と改行される方法はないでしょうか?
どんな状況でも幅を固定にしたいと思っています。
<table id="tukuttemitayo">
<tr>
<th>aa</th>
<th>bb</th>
<th>dd</th>
<th>ee</th>
<th>ee</th>
<th>gg</th>
<th>we</th>
<th>sdfsd</th>
<th>3ew</th>
<th>asf</th>
<th>saf</th>
</tr>
<tr>
<td>36</td>
<td>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaasaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td>
<td>有り</td>
<td>無し</td>
<td>neko</td>
<td>ham</td>
<td>表示中</td>
<td>ささ</td>
<td>ささ</td>
<td>ささ</td>
<td>ささ</td>
</tr>
<tr>
<td>87</td>
<td>こんちわ</td>
<td>有り</td>
<td>無し</td>
<td>2008-03-13 14:33:22</td>
<td>sd</td>
<td>sfd</td>
<td>sfd</td>
<td>sdf</td>
<td>sdf</td>
<td>df</td>
</tr>
</table>
#tukuttemitayo{
border-collapse:collapse;
width:330px;
background:red;
border:none;
}
#tukuttemitayo th {
width:30px;
border:solid 3px #00FF66;
background:yellow;
}
#tukuttemitayo td {
background:pink;
width:30px;
}
あと、すごく初歩的な事かもしれませんが、
tableに設定するwidthの幅はthやtdのborderの幅も含めて計算しなくてはならないのでしょうか?
<table>
<tr>
<th></th><td></td>
</tr>
<tr>
<th></th><td></td>
</tr>
</table>
table { width:104px } ←borderがあるので100ではなく104にする?
tr {width:50px border:1px }
td {width:50px border:1px}
どんな条件でもテーブルで固定される幅を作りたいです。
よろしくお願いします。
No.1ベストアンサー
- 回答日時:
> テーブルで幅を固定した場合に、アルファベットの文字を続けて入れると、
> それが改行されず、横に終わるまで続き、結果、固定した幅を無視した
> 状態で表示されてしまいます。
「アルファベットの文字を続けて入れ」たデータとは、即ち1ワード、という事ですから仕様上そうなるのが当然の事なんですが…これに拘る方、少なくないのでしょうか。ほぼ同様の質問が最近ありましたので、対処方法と考え方については下記を参照してはいかがでしょう。
http://oshiete1.goo.ne.jp/qa3840028.html
> tableに設定するwidthの幅はthやtdのborderの幅も含めて計算しなくてはならないのでしょうか?
セルにwidthを指定した場合borderやpaddingの値をどう解釈するかは、諸条件(主にDOCTYPEとメジャーなモダン・ブラウザの種類)により解釈が異なります。
以下のコンテンツの比較検証結果などは参考になると思います。
http://www.d-spica.com/try/table-width.html
http://2xup.org/log/2007/07/27-2111
> どんな条件でもテーブルで固定される幅を作りたいです。
上記であげた参考サイトでの実験でも一目瞭然ですが、<table>内のセルの幅を全て絶対値(px)で固定してしまうと、環境による表示結果に顕著な差が出てしまいかねないので、個人的にはあまりお奨めはしません。どこかに「逃げ」を残しておいた方が良いと思います。データ量の少ないセル(例えば、商品一覧だったら一列目の型番とか、名刺情報だったら氏名の列とか、ある程度以上の量にならない事が見込める様なデータですね)のみ固定値、残りは成り行き任せにする…とか。
私は滅多にセルのwidthは固定値にしません(セル内のデータが画像の場合はその限りではありませんが)。各列にある程度の比率を持たせたい場合はパーセンテージで指定しますね。
ありがとうございました。データベースから値を取り出した時に表示する方法に困っていました。スクロールバーで対応したいと思います。とても参考になりました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Visual Basic(VBA) Selenium.ChromeDriverの使い方について 7 2022/09/22 06:43
- HTML・CSS テーブルタグのセルの幅の一部だけを指定 1 2023/03/12 12:02
- PHP htmlで複数の個数入力欄を表示させるには 1 2022/09/20 03:11
- JavaScript EasyUIのSubGrid(jquery)におけるObjectに入れた連想配列について 1 2022/05/02 11:21
- HTML・CSS 【CSS】:hasで可能? imgを含むtr要素を選択したい 1 2022/11/17 14:36
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
- HTML・CSS 自身のHPにYouTube動画を貼り付けるのが出来なくなり困ってます 1 2022/11/11 10:44
- AJAX JavascriptからPHPへのAjax通信でnullが返ってくる 3 2022/08/03 22:00
- MySQL SQL任意に並び替えをしたい 2 2023/08/28 10:47
- 工学 【制御工学】単位ステップ応答の遅れ時間の求め方(令和2年度の機械設計技術者試験(制御工学)の問題) 3 2022/11/02 10:51
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
テーブルの行を折りたたみたい...
-
テーブルのヘッダとボディの幅...
-
テーブルの任意の列を非表示に...
-
この出品にある送料表の作り方
-
テーブルの行の高さを指定する...
-
テーブルを2つ横に並べる
-
tableの要素(tr、td)に一...
-
htmlで作成するテーブルの横線...
-
EXCELの表にTABLEタグをテキス...
-
画像と画像の間の空白
-
テキストエリアについて
-
tableタグ内の文章を上から揃え...
-
スクロール付きのテーブルで、...
-
<table>を複数使用するレイアウ...
-
ASPでmdbファイルからデータの...
-
幅の違うテーブルを作りたい
-
商品詳細を横並びに表示する方法
-
TABLEのセルの中の文字を行単位...
-
テーブル幅が固定できない
-
テーブルとテーブルの間隔について
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
TRタグの余白をcssで設定するには
-
tableにul,または,olを入れられ...
-
テーブルの任意の列を非表示に...
-
テーブルのヘッダとボディの幅...
-
cssで、表示されるテキストによ...
-
HTML <td></td>タグ セル内余...
-
文字列が入っているtdを削除せ...
-
テーブルのセルに画像をピッタ...
-
テーブルの行を折りたたみたい...
-
テーブルの行の高さを指定する...
-
テーブルの表示がずれます
-
テーブルタグのセルの幅の一部...
-
中に<table></table>が使えるア...
-
逆L字の表(table)組み
-
ホームページ 表の上の余白を...
-
表の中の列の順番を入れ替える...
-
EXCELからhtmlへの変換で罫線が...
-
tableでcolspanを使うと次行以...
-
表の1列だけをCSSを使って右揃...
-
文字の中央そろえを一括で指定...
おすすめ情報