画像貼り付け時のサイズ指定方法

HTML言語で画像を貼り付ける時に横幅のみ指定すれば縦は勝手に決まるのだと思っているのですが、自分のサイトをIE8で見たところ横幅は合っていて縦はぺちゃんこに潰れた状態（高さ０）になってしまいました。
GoogleCromeとsafariでは正常に見れました。

IE8でも正常に画像が見れるようにするにはどうしたらいいでしょうか？

ちなみに画像を貼り付ける時のタグは以下のように記述しています。
<img src="img/desorate1.jpg" width="640" height="" border="0" style="float:left;margin:4px 14px 4px 6px;border-style:groove;border-width:10px">

ホームページは以下になります。
http://tokusyukogata.web.fc2.com/experience.html

No.1 ベストアンサー 回答者： PXU10652 回答日時： 2011/06/08 23:26

「IE8でも正常に画像が見れるようにするにはどうしたらいいでしょうか？」

　縦幅を指定しないなら、「height=""」の記述を消せば、正しく表示されます。

　ＩＥ８では、「height=""」と記載されていると、数値が分からないので、勝手に「height=1」として、処理するようです。
（ホームページのソースは、「height=""」でしたが、保存すると「height=1」になっていました。それを削除すると、ローカルではＩＥ８で正しく写真が表示されることを確認できましたので。）

この回答へのお礼

ご指摘の通りに修正し、IE8で正常に表示されました。
ローカルにまで保存して確かめていただいてありがとうございました！

お礼日時：2011/06/09 00:54

No.3 回答者： ORUKA1951 回答日時： 2011/06/08 23:50

　height:autoが有効なわけは、とstyle属性にheightというプロパティが出てきた時点で詳細度100として、属性値0の属性heightを上書きするからです。

　style属性内のwidth,heightいずれかに、autoを記載すると、heightなりwidthにどんな値が入っていても上書きされます。
　これはとても便利で、後方互換のため、img要素に、width="240" height="120"と書かれていても、外部スタイルシートでwidth:120;height:autoとすると、詳細度が最低でも1なので、上書きされる。セレクタの書き方で詳細度は変わります。

　もちろん、
<img src="img/desorate1.jpg" width="64" height="48" border="0" style="float:left;margin:4px 14px 4px 6px;border-style:groove;border-width:10px;width:640px;height:auto">
は、スタイルシートを読み取れない携帯電話では64と48で表示されるが、パソコンでは640pxと480pxで表示とか。


　

この回答へのお礼

この様なやり方もあったんですね。
ご指摘の方法を試してみると正常に表示されました。
詳細なご説明ありがとうございます！

お礼日時：2011/06/09 00:56

No.2 回答者： ORUKA1951 回答日時： 2011/06/08 23:30

style="float:left;margin:4px 14px 4px 6px;border-style:groove;border-width:10px;height:auto;"

で良いと思うけど？？？