画像化の表示崩れ
リストページ
cube/data/Smarty/templates/default/mobile/product/list.tpl
おすすめ商品
cube/data/Smarty/templates/default/mobile/frontparts/bloc/best5.tpl
など・・
<a href="<!--{$smarty.const.MOBILE_DETAIL_P_HTML}--><!--{$arrProduct.product_id}-->"><img
src="<!--{$smarty.const.IMAGE_SAVE_URL|sfTrimURL}-->/<!--{$arrProduct.main_list_image}-->"
alt="<!--{$arrProduct.name|escape}-->" height="48" width="60" align="left" />
</a> |
このように画像のサイズを指定している。
画像の大きさが全て一緒なら、たても横もサイズを指定してもんだいない。けれど、縦横のサイズが全て違う場合、両方のサイズを指定すると妙な形に表示されてしまいます。
なので、普通は縦か横か、どちらか一方を指定します。
あたりまえですが、。縦が固定されると横がバラバラになります。
横が固定されると、縦がバラバラになります。
私の例の場合、縦が統一されていないため、小さいサイズのものが改行に失敗して、表示崩れをおこしています。
そこで高さを固定しました。
改行は崩れません。
扱う写真によっては、横を固定したほうがいい場合もあるかと思いますので、ここらへんはそれぞれで考えて下さい。
|