根据浏览器分辨率设置页面内容

Here is my default browser size.And my QR code is at right place.

When i re-size my browser .I got this one.But here my QR code is disappearing if I reduce it more.

I want QR code在下面captcha。我已经搜索过，得到了一些答案，但在我的情况下都不起作用。请帮忙。

这是我的代码。提前致谢。

       <div style="border: 1px solid lightgrey; border-radius: 10px 10px 10px 10
        </table>px; width: 75%">
        <table width= "75%" style="margin-left:1%">
            <tr>
                <td>
                    @Html.Captcha("Refresh", "Enter Captcha", 5, "Is required field.", true)<div style="color: Red;">@TempData["ErrorMessage"]</div>
                </td>
                <td>
                    <div id="qrcode" style="width: 200px; display: none">                       
                        <img src="@Url.Action("QrCode", "Qr", new { url = Model.ShortUrl })"  onclick="AppendURL('@this.Model.ShortUrl')"/>
                    </div>
                </td>
            </tr>
        </table>
    </div>

这是你需要的吗？

<div class="container">
    <div class="captcha"></div>
    <div class="qrcode"></div>
</div>

.captcha{
    float:left;
    width:200px;
    height:100px;
    background:#123;
}

.qrcode{
    float:left;
    width:200px;
    height:100px;
   background:#456;
}

DEMO: http://jsfiddle.net/fWAg5/ http://jsfiddle.net/fWAg5/

Capta 和 qrcode div 在空间足够的情况下内联显示，如果空间不足则垂直堆叠。但如果您想针对不同的分辨率执行此操作，我建议您研究一下媒体查询！