htmlファイルを修正しています。

このページには、PHPタグが埋め込まれた、htmlで記述テーブルがあるのですが、
テーブルのサイズ調整が、上手くできません。

下記のような記述があるとします。

<table>
<tr>
<td width="62">{$t_food_sa_price[t_food_sa]}dollar~</td>
</tr>
</table>

<td>幅62と指定されていますが、62で表示されません。

{$t_food_sa_price[t_food_sa]} ←<td>タグで囲まれた、この部分を削除すると、62で表示されるようになります。

phpタグを埋め込むと、指定したサイズで表示されなくなってしまうようなのですが、
<td>タグで指定した幅に表示させるには、どのように対処すれば良いでしょうか?
phpタグの前後に、何か入れるのでしょうか?

※私はPHPの知識はありませんので、htmlファイル上での修正で完結するような方法があったら教えてください。

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2011/07/21 13:49:20
  • 終了:2011/07/28 13:50:02

回答(4件)

id:mogya No.1

mogya回答回数22ベストアンサー獲得回数12011/07/21 14:38:25

ポイント50pt

中に書いているPHPコードが出力するHTMLのサイズが62pxより大きいので、その分拡張されてしまっていますね。

<td width="62">
{$t_food_sa_price[t_food_sa]}dollar~
</td>

これを

<td ><div style="width:62px;overflow:hidden;">
{$t_food_sa_price[t_food_sa]}dollar~
</div></td>

こういうふうにしておけば、PHPが何を出力しようと、62pxより大きい物は表示されなくなって、サイズ指定を優先することができます。

でも、こんな強引な手を使うと、例えば¥12800のゼロが表示されなくて¥1280に見えてしまったりするかもしれません。ちゃんと直すのであれば、中のPHPコードを書いた人と相談するのがいいかと思います。

id:km1981 No.2

km1981回答回数429ベストアンサー獲得回数492011/07/21 18:45:39

ポイント50pt

ブラウザは何ですか?

htmlのバージョンは何を指定していますか?


htmlのバージョンを指定していないと

最近のブラウザではhtml5になるものが多いので

tdにはwidth属性は指定できません

htmlだけの場合は「たまたま」62ピクセル以内だったのだと思います


スタイルシートを使うといいと思います

id:rouge_2008 No.3

rouge_2008回答回数594ベストアンサー獲得回数3512011/07/22 07:47:13

ポイント50pt

IEで確認したのでしょうか?

IEの場合、テーブル全体の幅を指定していないと、セルの内容に合わせて勝手に広げて表示するようです。

テーブル全体の幅に指定した値が各列の合計より大きい場合は、テーブル全体の幅に指定した値まで勝手に拡げて表示されます。(こちらはFirefoxでも同様です。)

「<table width="各列幅の合計">」等、テーブル全体の幅を正しく指定してみてください。

(項目の列150px、価格の列70pxの場合、合計の220を指定しますが、セルと内容の間の余白を指定している場合はその分も足して合計値を指定します。

※なお、価格を表示するセルの幅が足りないみたいですので、現在の62pxよりもう少し大きい値を指定して置く方がいいと思います。幅が足りない場合、折り返して表示されます。


既に他の回答で出ていますが、スタイルシートを使用する方がいいかもしれません。

CSSの場合、HTML要素に対して列の幅を指定するだけで大丈夫です。(テーブル全体の幅を指定する必要がありません。)

列によって違う幅を指定したい場合は、各列にクラス名を割り当てて、CSSでクラス名に対して幅を指定します。

※IEの場合、指定値より長い内容のセルすべてにクラス名を割り当てる必要がありますが、<colgroup>を使用すると列に対してまとめて指定できるので便利です。

http://www.tohoho-web.com/html/colgroup.htm


例)HTML(※商品名と価格の2列のテーブルの場合)

<table>
<colgroup>
<col span="1" class="item">
<col span="1" class="price">
</colgroup>
<tr>
<th>商品名</th>
<th>価格</th>
</tr>
<tr>
<td>XXXXX</td>
<td>$t_food_sa_price[t_food_sa]}</td>
</tr>
<tr>
<td>XXXXX</td>
<td>$t_food_??_price[t_food_??]}</td>
</tr>
</table>

例)CSS

th, td {
	padding: 6px;
}
.item {
	width: 80px;
}
.price {
	width: 70px;
}

スタイルシートが分からない場合、以下のページを参照してください。

http://www.tohoho-web.com/css/basic.htm

id:iooioiaa No.4

iooioiaa回答回数5ベストアンサー獲得回数12011/07/24 04:26:49

ポイント50pt

読み込んでいるCSSファイル(インクルード)にtableタグのサイズが指定されていませんか?

例えばwidth:100%とか。

id属性が設定されていないCSSファイルであれば、id属性を設定。

難しければ、tableタグにwidth: 62pxを記述。

もし、インクルードされているCSSファイルが

table {

width: 100%;

}

のようになっているのであれば、

<head></head>部分に

table {

width: 62px;

}

を記述すれば、

htmlファイルを修正するだけです。

  • id:nobu55
    なかなか回答をいただけないのですが、私が検討違いの質問をしているのではないかと不安です。
    何かコメントでも結構ですので、いただければと思います。
    引き続きよろしくお願いします。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません