根据浏览器分辨率设置页面内容
这是我的默认浏览器大小。我的QR码在正确的位置。
当我重新调整浏览器的大小时。我得到了这个。但是如果我减少它的话,我的QR code
就会消失。
我想要validationQR code
下的QR code
。 我搜索了它,得到了一些答案,但都没有在我的情况下工作。请帮助。
这是我的代码。谢谢。
<div style="border: 1px solid lightgrey; border-radius: 10px 10px 10px 10 px; width: 75%"> @Html.Captcha("Refresh", "Enter Captcha", 5, "Is required field.", true) @TempData["ErrorMessage"] | |
这是你需要的吗?
.captcha{ float:left; width:200px; height:100px; background:#123; } .qrcode{ float:left; width:200px; height:100px; background:#456; }
演示: http : //jsfiddle.net/fWAg5/
如果空间不足,Capta和qrcode div显示内联,其中有足够的空间并垂直堆叠。 但是,如果你想为不同的分辨率做这件事,我建议调查媒体查询!
问题是1)表格宽度为600像素(800px的75%)因此它永远不会随窗口缩小,2)validation码和QR码位于相邻的表格单元格中,因此它们无法表现出来相对于彼此流畅地。 你不能float
表格单元格。
因此,从外部div和表中删除宽度,将QR放在与validation码相同的表格单元格中,然后浮动validation码,例如将其放入容器中并为容器提供一些样式。
我做了一个小提琴 ,但请注意,你不能只是复制我的代码,因为我必须删除所有MVC命令,使其看起来正确。