我犹豫要不要说 wordpress 中有一个错误,但这让我很困惑。当我在 chrome 中将以下内容作为 html 文件查看时,它工作得很好。当我尝试在 wordpress 中执行此操作时,我在不同的移动设备上遇到了各种各样的问题。本质上,左右 id 不占用分配的宽度。我停用了除添加 css 代码之外的所有插件,并进行了健康检查,但都没有对问题产生任何洞察力。这是代码:
<!DOCTYPE html>
<html>
<head>
<style>
#container{
display:flex;
justify-content:start;
width:100vw;
font-size:3vw;
}
#left{
width:35vw;
border:solid black 1px;
border-shadow:border-box;
}
#right{
width:65vw;
border:solid black 1px;
border-shadow:border-box;
text-align:center;
}
</style>
</head>
<body>
<div id="container">
<div id="left">mobile</div>
<div id="right"> different devices have problems</div>
</div>
</body>
</html>
最佳答案
在您的网站上,有一个 html, body
的 CSS 规则,其中包含 min-width: 490px
这会导致您的 body
在小型设备上比屏幕宽(即或多或少的任何纵向智能手机)。 right
/left
规则适用,但它们的百分比是根据 body
宽度 490px 计算的。
关于css - Wordpress 不遵守移动设备上的 css 规则,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58828442/