私はこのコードを持っています:
<table class="pricetable">
<tbody>
<tr style="background-color: #E6E6E6 !important;">
<td rowspan="4" class="iti">
<div class="itemTableImage" style="background: url(http://www.storagerealm.com/images/intel-ssd-520.jpg) no-repeat; background-size: 100% 100%;"></div>
</td>
<th>Capacity</th>
<th>Price</th>
</tr>
<tr style="border: 1px solid black;">
<td class="cell1">128 GB</td>
<td class="cell2">$129.99</td>
</tr>
<tr style="border: 1px solid black;">
<td class="cell1">256 GB</td>
<td class="cell2">$229.37</td>
</tr>
<tr>
<td class="cell1">512 GB</td>
<td class="cell2">$444.99</td>
</tr>
</tbody>
</table>
CSSは次のとおりです。
.pricetable {
width: 100%;
height: 275px;
border: 3px solid black;
margin: 0.5em auto 1em;
text-align: center;
border-collapse:separate;
border-spacing:5px 5px;
}
.iti {
width: 275px;
background-color: #FBF5EF;
}
div.itemTableImage {
width: 97%;
height: 97%;
margin: 0 auto;
box-shadow: 0 0 8px rgba(0, 0, 0, .8);
-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
}
Chrome、Safari、Opera での結果には満足していますが、Firefox と IE では製品の画像が表示されません。
Chromeで結果として得られるものは次のとおりです。
http://oi40.tinypic.com/35hgxuq.jpg
そして、これは私がFirefoxで得たものです:
http://oi40.tinypic.com/ra3vo4.jpg
あなたの助けに感謝します。