所以我在网站制作特定页面时遇到了一些问题，我正在使用移动设备。我有移动友好的元标记<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">，但似乎没有做到这一点。问题出在我的测试网站“www.websitetesting.pro”
受影响的元素是投资组合下的图像，它们在“rowone”div中以3行的形式列出，图像本身在带有“rowone”的图元素下。 问题很可能是在CSS的投资组合页面“portfolio.css”中使用上述元素。 这是代码。
答案 0 :(得分：0)
您需要更多地研究响应式设计。从.column div明确设置为300px开始，您遇到的问题很少。你有3个连续，所以如果您的屏幕分辨率<1 900px宽，这显然是一个问题。设置百分比是一个更好的主意。
您可以首先将宽度设置为32％，将边距设置为1％，然后在max-width: 100%元素内设置figure，以便更好地了解如何设计响应式网站。
注意：这些值是针对您的示例任意制作的，并不等于100％。已经为响应式设计制作了大量网格。虽然它不是我首选的解决方案，但您可能希望将Bootstrap视为跳出点。
答案 1 :(得分：0)
最好避免设置固定宽度并使用px进行尺寸调整。这是因为不同的设备具有不同的像素数和比率。尝试使用em / rem获取字体和百分比以调整布局大小。
W3 Schools提供了一个关于RWD的好教程。看看吧。