Hi all – My job has several websites, all hosted in-house. Each site resides in its own folder directly under wwwroot on the web server. Here is my question: What could cause the HTML files to display differently from folder to folder?
Why I’m asking: A site that I recently did looks great when viewed locally. If I place the files into the folder where our main .com site lives (and view it via the www address), it displays perfectly. But – when I place the files into the adjacent folder where it’s supposed to live and view it via the web, the page goes rogue. Container divs are failing to hold their assigned widths, and are failing to contain the nested divs within them. It’s a mess.
This behavior only happens when I view the site via the web - if I view it locally from that same folder, it's fine. I also did a table-based version of the layout as a test and again encountered display issues from folder to folder when viewing online.
I am stumped as to why the page is displaying perfectly from one folder and falling apart from another. Our tech folks are stumped also. I validated the HTML, so I don't think that's the culprit. This happens in both IE and Firefox, so it’s not a browser issue. The only thing I can think of is that it’s some server/folder setting, but I don't know anything about "server stuff."
Hope I've explained this clearly. Thanks much for any assistance.
UPDATE: Paths to styles, .js files, etc. are all relative, but I am moving the entire folder structure - all images, all css files, all scripts, all everything. Thx for the replies.
UPDATE #2:
Just so y’all don’t think I’m crazy – I tried an experiment:
I made a simple HTML doc and dumped it into both of the folders I previously referenced. Here’s the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
ul{
list-style-type:none;
}
li{
display:inline;
}
a{
float:left;
width:100px;
text-decoration:none开发者_Python百科;
color:white;
font-weight:bold;
background:#999900;
padding:5px;
border-right:1px solid #FFFFFF;
}
a:hover{
background:#CCCC00;
}
#buttonbox {
width: 768px;
background-color:#993333;
margin-left: auto;
margin-right: auto; }
</style>
</head>
<body>
<div id="buttonbox">
<ul>
<li><a href="#">Css</a></li>
<li><a href="#">Flash</a></li>
<li><a href="#">ActionScript</a></li>
<li><a href="#">Javascript</a></li>
<li><a href="#">SQL Server </a></li>
<li><a href="#">PHP</a></li>
</ul>
</div>
<p> </p>
<table width="768" align="center" border="0" cellpadding="0" cellspacing="0"><tr><td bgcolor="#993333"><ul>
<li><a href="#">Css</a></li>
<li><a href="#">Flash</a></li>
<li><a href="#">ActionScript</a></li>
<li><a href="#">Javascript</a></li>
<li><a href="#">SQL Server </a></li>
<li><a href="#">PHP</a></li>
</ul> </td></tr></table>
</body>
</html>
As you can see – it’s 2 instances of a horizontal navigation bar. The first is in a div with a background color, the second is in a table row with a background color. Note that there are no linked files – all styles are in the head of the document.
Here's a screenshot comparison of how it displays from folder A vs. how it displays from folder B:
Same file, same browser, no linked styles, different result. As I mentioned before, these are adjacent folders on the same server, each mapped to a different www address.
Again, I appreciate any insight. Thanks.
As Marc B mentions, a possible answer is an issue with the paths and some missing styles that are causing the page to render incorrectly when moved.
The example below is a relative link to a stylesheet (a file called "mystyles.css" in a directory called "css" under the directory that the html file is in). If you moved the file containing this link you would also need to move the file called mystyles.css (and its containing directory, "css").
<link rel="stylesheet" type="text/css" href="css/mystyles.css">
Look in Firebug or Chrome Developer Tools for console errors and warnings. They will show you any missing resources and render errors.
If nothing is out of place, compare the CSS of both versions in these tools.
![Interactive visualization of a graph in python [closed]](https://www.devze.com/res/2023/04-10/09/92d32fe8c0d22fb96bd6f6e8b7d1f457.gif)
加载中,请稍侯......
精彩评论