浏览器窗口大小其他则在模板中

Question

在Figma中(无论在哪里(，模板的宽度为1920px。我想用它创建一个页面，但在浏览器中，这个页面有1903px。由于它，我的一些元素不适合和包裹(例如使用柔性包裹时(。所以问题是，如何正确制作？

编辑：关于这个屏幕上有澄清，我试图添加第四个正方形，但没有空间，所以它包到了底部。浏览器宽度是1903px，在我做的模板内是1920px。其他人在这种情况下是怎么做的，必须如何做才能在所有电脑屏幕上做出反应？

Answer 1

将它包装在容器中，就像在引导程序中一样，您可以指定它只能包装到哪个屏幕例如：.ccontainer xl只会在xLarge屏幕上将您的内容包装在容器中。

Answer 2

有几种不同的方法可以解决这个问题。第一个答案与拉希德的回答大致相同。你可以在你的项目中使用Bootstrap，只需按照他们的指导在你的工程中创建一个网格系统。有了引导程序，你可以用下面的代码来解决你的问题：

<div class="container">
<div class="row">
<div class="col">
1 of 3
</div>
<div class="col-6">
2 of 3 (wider)
</div>
<div class="col">
3 of 3
</div>
</div>
</div>

在网格系统由12列创建的情况下，您可以指定一个元素应该占用多少col-2、col-3、col-4等。如果您希望它们在所有屏幕上都具有相同的宽度，那么只需将每个列指定为col，引导程序将负责其余部分。

如果你不能或不想使用Bootstrap，下一个解决方案是使用CSS创建自己的网格系统。如果没有您的代码示例，很难确切地指定它的外观，但遵循本指南应该会帮助您。