页面刷新后div的宽度不同答案

【问题标题】：div has different width after page refresh页面刷新后div的宽度不同
【发布时间】：2026-02-26 17:00:02
【问题描述】：

当有人打开页面时，<div> 将获得全宽 (1200px+)。如果我重新加载页面，宽度将更改为右侧（550 像素）。浏览器的缓存已清除，因此这不是缓存问题。

第一次访问：

刷新后：

这是 Joomla 2.5 站点中的“自定义 HTML 代码”模块。这是交换宽度的 div 的代码：

<div class="art-nostyle">
<div class="custom">
<div id="script_nn_tabs54bfa417561de" class="script_nn_tabs" style="display:none;"></div>
<div id="nn_tabs_container_1____685___" class="nn_tabs_container outline_handles outline_content align_left nn_tabs_container_1_">
<div class="nn_tabs_nav" style="display: block;"></div>

乍一看，我认为div id="nn_tabs_container_1____685___"是问题所在，所以我在模块末尾添加了这个jQuery脚本：

var j = jQuery.noConflict();
j(document).ready(function () {
 j("div[id^='nn_tabs_content_1____']" ).css("width","550px");
});

修复失败后，我注意到问题出在<div class="art-nostyle">。那个 div 根本没有风格！我不能将上述脚本用于art-nostyle div，因为它是在站点中的每个模块之前添加的。当这可能不是缓存问题时，有人可以解释这怎么可能 - 页面刷新后元素得到固定宽度？我在 5 台之前从未访问过该 URL 的不同 PC 上进行了尝试。

附：我无法在 JSFiddle 中重现问题：这就是我没有发布小提琴链接的原因。

编辑：Link of the site 如果有人想用自己的眼睛检查。它位于索引的中间。 Edit2：我注意到如果我禁用 cookie 刷新后 div 不会改变宽度。它将保持整个宽度。

【问题讨论】：

抱歉，我误读了您的问题。但是你能说出输出css有什么变化吗？从第一次和第二次刷新开始。
刷新后
的宽度从1200px变为550px。
页面刷新后哪个 div 的宽度会发生变化？是.art-nostyle 还是#nn_tabs_content_1____？可以多发一点 HTML 吗？
.art-nostyle 正在改变。如果我发布更多代码，我相信它不会有帮助，因为它会更复杂，并且其余元素具有正确的尺寸。
我看到了链接，我想我会先注释掉每个 .js 文件，看看哪个是问题，也许是 .ready() 中没有加载一个？

【解决方案1】：

如果您使用 jQuery，也许您可以删除可能从 Joomla 继承奇怪样式的“.art-nostyle”类。你可以给<div class="art-nostyle">一个唯一的ID（例如id="navigationLinks"），然后使用这个：

$(function() {
    $("#navigationLinks").removeClass("art-nostyle");
    $("#navigationLinks").css("width","550px");
});

您还可以检查是否有任何其他 Javascript 引用此 div，因为有问题的 div 会仅从 HTML/CSS 继承奇怪的行为似乎很奇怪。

【讨论】：

这是一个非常聪明的主意。即使我删除了课程，现在我有一个<div>，第一次访问时宽度为 1200 像素，刷新后宽度为 550 像素的<div>。
我更新了我的答案，以反映您希望 div 具有 width:550px 样式而不是 width:1200px，无论用户刷新浏览器多少次。请让我知道这是否适合您。
那也没用。我添加了该网站的链接，这样您就可以自己查看正在发生的事情。