I am currently facing an issue with my website where I have linked one .css stylesheet to 3 different pages. This is just a temporary template until I finalize the individual look of each page.
After performing some div positioning on the site, most pages appear nicely centered except for one. Despite being connected to the correct style sheet, this particular page does not adjust certain divs as intended. Here is a comparison:
Non-Working Page: Click here
If you observe closely, you will notice that the links and main content sections are shifted towards the upper-right corner on the non-working page while they are aligned properly on other pages of the website.
This seems to based on the CSS code used across all pages but with different image sources specified. Therefore, theoretically, all pages should display similarly. Below is the code snippet for both pages:
Code for Working Page:
<!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>Teens For Antarctica Preservation</title>
<link href="template.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="header"><div style="margin-left:200px;"> <img src="images/logo_2.jpg" width="600" style="padding-top:12.5px;" />
</div>
</div>
... (omitted for brevity)
</body>
</html>
And the code for Non-Working Page:
<!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>Who is TAP?</title>
<link href="template.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="header"><div style="margin-left:200px;"> <img src="images/logo_2.jpg" width="600" style="padding-top:12.5px;" />
</div>
</div>
... (omitted for brevity)
</body>
</html>
Here is the CSS stylesheet in use:
@charset "utf-8";
/* CSS Document */
... (omitted for brevity)
...
Your insights or solutions on how to rectify this discrepancy would be greatly appreciated.