HTMLのTableの中に写真を表示するものを作っています。

質問

HTMLのTableの中に写真を表示するものを作っています。
テーブセルルを固定したいのですが、
写真の大きさによってはどうしてもテーブルセルが大きくなってしまいます。

<td width="200" heigth="300">内にでテーブルセルを固定
画像も読み込む時に<img src="test.jpg" width="200">　としています。
比率維持のためheigthは未指定

しかし、縦長の画像などがくると固定しているにもかかわらず
テーブルセルが大きくなります。
（比率維持してるので画像サイズ指定でたてが大きくなるなど）

写真の入るテーブルセルは完全に固定したいのですが

何か良い知恵ありますでしょうか？

ソースイメージ　添付します
<%=　はASPのため変数です。ループさせてます。

回答No.3

naokita · ベストアンサー

そりゃー小さい枠内に大きい画像を入れるのだから、枠が崩壊するに決まっている。
妥協案としては、
はみ出した部分をCSSで非表示にする。

td div{ width:200px; height:300px; overflow:hidden;}

<table>
<tr><td>
<div><img src="img.jpg" width="200" alt="*" /></div>
</td></tr>
</table>

それが、
嫌なら画像サイズを縦300で固定するか、
横200も入れて比率を崩すか、
画像を作り直すか。

回答No.4

BellBell

＞でも横長の画像がきたら同じですよね。。。
ASP使ってるんだったら、画像の縦横比を取得して判定すればいいんでないの？
表示枠が W/H = 2/3って事で、画像の比率が2/3以上であれば、横長と判定してwidth="200"を出力して、2/3未満であれば縦長と判定してheight="300"を出力するって感じですね。
※横長縦長の言葉は元質問者様に合わせて使いましたので、厳密に定義として間違ってるとのツッコミはなしの方向で。

回答No.2

noname#169205

画像のサイズは不明な状態でセルを固定したいって事でしょうか？
スタイルシート使えば出来そうです
<img src="test.jpg" style="max-width:200px;max-height:300px">
でどうでしょうか？

回答No.1

steel_gray

縦長の画像のimgは height="300" を指定して width="200" を省略すればいいんじゃないかな。

補足

ありがとうございます
でも横長の画像がきたら同じですよね。。。