gpt4 book ai didi

css - 内容在 Chrome、Opera 中缩小,但 FireFox 可以正确呈现

转载 作者:行者123 更新时间:2023-11-28 08:59:30 25 4
gpt4 key购买 nike

好的,首先我花了更多时间得到了解决方案,但我想知道原因。无论是浏览器错误还是我犯了一些错误。

请查找以下完整代码,这些代码在 Google Chrome、Opera 和其他少数浏览器中错误地呈现了此页面。此代码在 FireFox 中正常工作。我无法提供 jsfiddle 链接,因为这个问题在那个环境中没有重现。

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
#middlecontainer{width:1000px; height:auto; background-color:#fcf6e2; float:left;}
.matterbox{width:750px; height:auto; float:left;}
.rightsidebox{width:250px; height:auto; float:right; }
.matter{padding:15px; padding-top:10px;
.heading{ padding:8px; padding-left:5px; font-weight:bold; background-color:#f5d7a7;}
.subheading{font-size:15px; padding-top:5px; color:#663300; font-weight:bold;}
</style>
</head>
<body>
<div id="middlecontainer">
<img src="http://placehold.it/1000x150" align="top"/>
<div class="matterbox">
<div class="matter">
<div class="heading">Welcome to product registration</div>
<p class="style1">Important </p>
</div>
</div>
<div class="rightsidebox">
<div class="matter">
<p> This is right hand column </p>
</div>
<div style="clear:both"></div>
</div>
</div>
</body>
</html>

如果您能够在 Chrome 或 Opera 中重现此代码(middlecontainer div 变得不可见),那么您可以将 style="float:left" 内联添加到 img 标签。这解决了这个问题,但我试图找出这个问题的原因。

最重要的是,FireFox 可以毫无问题地正确呈现此页面。

如果我需要将此代码上传到某些在线 Web 服务器,请告诉我。

我已经在这个Link上上传了网页

最佳答案

这是因为除非您另有说明,否则浏览器会自动将网站呈现为默认缩放。您应该使用元标记来声明网页的缩放。查看https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag .如果您需要更多帮助或者这不是您想要的,请回复。

从手机发送。

关于css - 内容在 Chrome、Opera 中缩小,但 FireFox 可以正确呈现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26989496/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com