View Full Version : Page alignment issue

Nov 13th, 2009, 05:45 PM

I have two index.html files (in two different folders) on a server.

The first file has the Web page centered - which is how I want it:


The second file, which should appear exactly the same, is incorrectly left aligned and I cannot work out why:


Both files have exactly the same in their <HEAD> tages:

<link rel="stylesheet" href="../_common/css/main.css" type="text/css" media="all">
<link href="imageMenu.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="css/contact.css" media="screen" />

Both index files can 'see' their respective CSS files. Altogether both index files reference five different CSS files.

Any advice on resolving this would be appreciated.



Nov 13th, 2009, 06:03 PM

The link to main.css is broken on the second url. That double slash before index.htm looks odd as well.

Nov 13th, 2009, 06:05 PM
http://stevehigham59.7host.com/finalProof/imagemenu/_common/css/main.css has html code in it instead of the CSS used by the page that works.

Validator results (http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Fstevehigham59.7host.com%2FfinalProof%2Fimagemenu%2F%2Findex.htm)


Nov 13th, 2009, 06:10 PM
Hello SB65

But the links to both files are exactly the same:

<link rel="stylesheet" href="../_common/css/main.css" - oldIndex

<link rel="stylesheet" href="../_common/css/main.css" - newIndex


Nov 13th, 2009, 06:20 PM
The one that's broke appears to be in ...finalProof/imagemenu// (what's up with the // ?)
and the one that works is in ...finalProof/imagemenu original/

Here's what's in it-
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML><HEAD><TITLE>The page cannot be found</TITLE>
<META HTTP-EQUIV="Content-Type" Content="text/html; charset=Windows-1252">
<STYLE type="text/css">
BODY { font: 8pt/12pt verdana }
H1 { font: 13pt/15pt verdana }
H2 { font: 8pt/12pt verdana }
A:link { color: red }
A:visited { color: maroon }
</HEAD><BODY><TABLE width=500 border=0 cellspacing=10><TR><TD>

<h1>The page cannot be found</h1>
The page you are looking for might have been removed, had its name changed, or is temporarily unavailable.
<p>Please try the following:</p>
<li>Make sure that the Web site address displayed in the address bar of your browser is spelled and formatted correctly.</li>

<li>If you reached this page by clicking a link, contact
the Web site administrator to alert them that the link is incorrectly formatted.
<li>Click the <a href="javascript:history.back(1)">Back</a> button to try another link.</li>
<h2>HTTP Error 404 - File or directory not found.<br>Internet Information Services (IIS)</h2>
<p>Technical Information (for support personnel)</p>
<li>Go to <a href="http://go.microsoft.com/fwlink/?linkid=8180">Microsoft Product Support Services</a> and perform a title search for the words <b>HTTP</b> and <b>404</b>.</li>

<li>Open <b>IIS Help</b>, which is accessible in IIS Manager (inetmgr),
and search for topics titled <b>Web Site Setup</b>, <b>Common Administrative Tasks</b>, and <b>About Custom Error Messages</b>.</li>


Nov 13th, 2009, 06:24 PM
It is the double slash (/) in your second URL that is the problem/issue. If you remove one of them the page renders as you expect it to.

Nov 13th, 2009, 06:24 PM
Hehe, just realized it's a page about proof reading.

Nov 13th, 2009, 08:41 PM
lol nice spot how ironic.

The link to main.css is broken because of the double slash, because it doesn't backup out of the folder properly.

The link to main.css is fine within itself, it's because the // in the URL causes the browser to get confused, so when you are using ../ to back up out of the directory, it's removing one of the slashes!

Nov 13th, 2009, 09:58 PM
SteveH: This is off topic, but how are you getting your headings to look nice and smooth (the "features" and "browser compatibility" headings)?

I've tried all fonts and as soon as I get larger than about 14px, it's all jagged. I want smooth headings like you have. Any tips would be appreciated. Thanks.

Nov 13th, 2009, 11:49 PM
SteveH: This is off topic, but how are you getting your headings to look nice and smooth (the "features" and "browser compatibility" headings)?

It's not text.
See http://stevehigham59.7host.com/finalProof/_common/img/heading-features.gif

Nov 15th, 2009, 02:15 PM

Many thanks to everyone who has posted.

I think those who have kindly contributed here have determined that the problem lies in the two forward strokes. As Scriptet says:
because the // in the URL causes the browser to get confused.

I have simply removed one of the forward strokes in the address bar and, yes, the page does now centre, but how would I permanently remove it?

Thanks again.