2016-07-01 20 views
3

このページの画像の一部が間違っている(2つの画像が他の画像よりも小さく見える)のはなぜか分かりません。これらの画像サイズの原因は何ですか?

https://www.violinschool.org/video-testing/

私は同じサイズにそれらすべてを再トリミングしている(355x200、比16:9)ので、それを引き起こして何か他のものがなければなりません。

は間違っているかもしれないものを見るために(それはツールセットタイプを使用してwordpressのサイトです)HTMLとCSSをチェックしようとしているが、無駄にしています。

答えて

1

試してみて、それが助けかどうかを確認:

table.wpv-loop.js-wpv-loop td { 
    width: 25%; 
} 
1

問題は、画像ではなく、tableではありません。現在、各table-cellは内容に応じて動的な幅を使用しています。 table-cellのコンテンツの数が多い場合は、他のコンテンツよりも幅が広いでしょう。

tabletable-layout: fixedプロパティを追加すると、すべてtable-cellは同じ幅になり、問題は解決されます。 <td>として

table { 
    border-bottom: 1px solid #ededed; 
    border-collapse: collapse; 
    table-layout: fixed; 
    border-spacing: 0; 
    font-size: 14px; 
    line-height: 2; 
    margin: 0 0 20px; 
    width: 100%; 
} 
1

テーブルで彼らはその内部内容に従って幅が幅をCSSで定義されていない刚性得る幅を固定されていません。

あなたは2つのソリューションでそれを行うことができます。

最初はです。table-layout:fixedを表に追加してください。

table{ 
    border-bottom: 1px solid #ededed; 
    border-collapse: collapse; 
    border-spacing: 0; 
    font-size: 14px; 
    line-height: 2; 
    margin: 0 0 20px; 
    width: 100%; 
    table-layout: fixed; 
} 

同じ幅の各セルを表示するテーブルを制限するtable-layout:fixedを追加します。

及び第使用幅

<td>であなたが幅手動width:25%を与えることができるので、あなたが正確4 <td> 1の行を使用しているように。あなたのCSSファイルに次の行を追加すること

td { 
    border-top: 1px solid #ededed; 
    padding: 6px 10px 6px 0; 
    width: 25%; 
} 
関連する問題