Index.html Page header display problem
I have used a template as the basis for a web site that is currently works-in-progress and seem to have an issue with the display of the index page where a background colour line, several pixels deep, appears across the page between two images in the header. I am using DW CS4 and the offending line can also be seen in DW4 Live View.
You can see the problem page at index.html
The line is removed in IE8 when running in compatibility mode/view.
The line is also displayed in Firefox. I have not yet tested using Chrome but as the issue is resolved using IE8 compatibility mode/view, it would indicate that I have introduced a coding problem?
Interestingly the other pages in the web site (e.g. bio.html) use a template and although once more using two images in the header, the background colour line does not appear.
So I am looking for an explanation why the line is visible and what I need to change in index.html to remove it?
Any advice is appreciated.
Thanks.
Ah Ha! Just found the problem
<div id="taglineWrapper">
<div id="tagline"><!-- TemplateBeginEditable name="tagline" --><!-- TemplateEndEditable -->
<p><img src="images/home/advancedhypno.png" width="306" height="42" alt="Advanced Hypnotherapist" /></p>
There are too many tags
I removed <p> and </p>
to give <img src="images/home/advancedhypno.png" width="306" height="42" alt="Advanced Hypnotherapist" />
and this solved the problem.
You have no idea how long I spent looking at the code before I spotted my error caused by a simple rogue carriage return!
I now need a coffee!
