添付画像のNopictureの画像を
下の方へ表示を拡大させたいのですが、反映されず
css
1 .thumbnail img{ 2 width: 100%; 3 height: auto; 4} 5
imgのサイズ指定以外に、不足してる指定があれば
教えてください。
css
1@media(max-width:779px){ 2.thumbnail { 3 background-color:#ffffff; 4 border: 1px solid; 5 border-color: #afaeae; 6 width: 48%; 7 height: auto; 8 text-align: center; 9} 10 11} 12@media(min-width:780px){ 13.thumbnail { 14 background-color:#ffffff; 15 border: 1px solid; 16 border-color: #afaeae; 17 width: 100px; 18 height: 100px; 19 text-align: center; 20} 21 22 .thumbnail img{ 23 width: 100%; 24 height: auto; 25}
html
1 <!-- 商品一覧(一覧形式の例) --> 2 <{section name=key loop=$goodslist}> 3 <!-- 1商品ずつの定義 --> 4 <div class="goodslist_box"> 5 <table border="0" width="100%"><tr valign="top"> 6 7 <td width="100%" align="center"><div class="thumbnail"><a href="<{$goodslist[key].url}>"><{if $goodslist[key].thumbnail}><img src="<{$goodslist[key].thumbnail}>"><{else}><img src="/tpl_img/proto_ja/nopic100.gif"><{/if}></a></div></td> 8 9 <td> 10 <a href="<{$goodslist[key].url}>"><{$goodslist[key].name}><{if $goodslist[key].num != ''}>(<{$goodslist[key].num}>)<{/if}></a><{if $goodslist[key].embargo}> *不能发送到日本以外的国家<{/if}><br> 11 <{$goodslist[key].price2}> <{$tsuka_tani}><br> 12 <{$goodslist[key].setsumei|mb_truncate:50}> 13 <!-- カートボタンフォーム --> 14 <div align="right"> 15 <form action="<{$cart_acturl}>" method="post"> 16 <{$goodslist[key].cart_hidden}> 17 <{section name=key2 loop=$goodslist[key].opt}> 18 <{$goodslist[key].opt[key2].name}> 19 <select name="goods_opt[]"> 20 <{html_options values=$goodslist[key].optv[key2].id output=$goodslist[key].optv[key2].name}> 21 </select><br> 22 <{/section}> 23 <!-- 在庫がない時はカートボタンを表示しない --> 24 <{if $goodslist[key].zaiko_flag && $goodslist[key].zaikosu <= 0}> 25 *没有库存 26 <{else}> 27 订购数量:<input type="text" name="kosu" size="4" value="<{$goodslist[key].min_kosu}>"><{$goodslist[key].tani}> 28 <input type="submit" value="装进购物车"> 29 <{/if}> 30 <!--// 在庫がない時はカートボタンを表示しない --> 31 </form> 32 </div> 33 <!--// カートボタンフォーム --> 34 </td> 35 </tr></table> 36 </div> 37 <!--// 1商品ずつの定義 --> 38 <{/section}>
スクリーンショットを拝見すると、td.thumbnail の幅が 302.733px となっていますが、ご提示のCSSでは width: 100px となっていますので、そのようになるのは少しおかしいと思います。
そのスクリーンショットを取った時のスクリーン幅はどうなっていましたか?
回答1件
あなたの回答
tips
プレビュー