モバイルで特定の高さを保持する画像が必要

Question

Wordpressテーマ（Jupiter）でVisual Composerを使用してサイトを開発しました。ほとんどのページには幅1600ピクセルの画像がある全幅の行があります。クライアントは、ブラウザウィンドウ/モバイルリポポンスが小さくなるにつれて、写真がどのくらい小さく縮小するかはわかりません。

http://spiderman.ephronsystems.com/full-width-tester/

私はmediaqueryで、このCSSを追加しました：

div.vc_single_image-wrapper.vc_box_border_grey {overflow:hidden;} 
img.vc_single_image-img.attachment-full {height: 200px;width:auto;max-width:none;margin:0 auto;} 

これはかなりうまく動作するようだが、私はむしろ、画像はブラウザウィンドウで中心であったでしょう。誰でもこれを修正する方法を知っていますか？私はまた、真のhtmlでVCコーディングを置き換えることができます。

Answer 1

は、以下の

@media (max-width: 736px) { 
    .wpb_single_image img { 
    height: 200px; 
    width:auto; 
    max-width:none; 
    margin:0 auto; 
    margin-left: 50%; 
    transform:translateX(-50%); 
    } 
} 

クエリ