Just noticed this on a web page I run for a friend of mine located at www.njsmpa.org
At the bottom there are (well there should be) 2 boxes with one reading "Resources" and the other "From the President" one has a gavil and the other has a photo.
When I view the page with Mozilla Firefox everything looks fine but I happened to view the page today with IE and it is showing 4 of those boxes at the bottom.
I looked at the coding and could not find a problem but I am assuming it has something to do with the CSS.
Anyone have an idea?
Possible CSS problem - Post ID 159980
Captain Ron
Registered User
210 posts
Inger
Senior Advisor
14,649 posts
Online Now
I'm looking at it right now. What site builder have you been using for this site? It doesn't look like anything from CoffeeCup??
Anyway, you ought to run the html page through the W3C validator and get rid of the 53 odd errors that I've seen. Haven't got around to inspecting the css file yet...
Anyway, you ought to run the html page through the W3C validator and get rid of the 53 odd errors that I've seen. Haven't got around to inspecting the css file yet...
Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger
Senior Advisor
14,649 posts
Online Now
The culprit was not the css file at all. After I corrected the errors and changed the sequence of some divs, it all fell into place.
Do you want to track down the errors yourself and learn something by doing so, or do you want the easy option; me posting the corrected file here?
While you are thinking about it, I'll say good night. It's nearly 01 am where I am. I'll be back tomorrow.
Do you want to track down the errors yourself and learn something by doing so, or do you want the easy option; me posting the corrected file here?
While you are thinking about it, I'll say good night. It's nearly 01 am where I am. I'll be back tomorrow.
Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Captain Ron
Registered User
210 posts
Sorry I didnt reply earlier as I did not get a notification there was a reply to the thread even though I subscribed to it.
TO answer your questions, I am using the Coffee Cup HTML editor but for this site I downloaded a template and made changes to accommodate it to our liking.
Would appreciate you posting the correct coding here but would also like to know what you found that was the problem. The funny thing is, I checked the site just now from a different computer and all looks fine but when I viewed it at home then I saw the images doubled..... most likely due to a newer version of IE on the hom computer I am guessing.
TO answer your questions, I am using the Coffee Cup HTML editor but for this site I downloaded a template and made changes to accommodate it to our liking.
Would appreciate you posting the correct coding here but would also like to know what you found that was the problem. The funny thing is, I checked the site just now from a different computer and all looks fine but when I viewed it at home then I saw the images doubled..... most likely due to a newer version of IE on the hom computer I am guessing.
Inger
Senior Advisor
14,649 posts
Online Now
OK, here goes...
The errors that caused those images to appear twice were these lines:
and
You can't have a div inside a a href, so as soon as I moved the divs in front, like this:
and similar with the other one, then the 'stereo effect' disappeared.
The other errors in the coding were mainly due to your using the doctype xhtml strict, but hadn't taken into account that all the coding then has to be in lowercase, and the self closing tags, such as e.g. <br> will have to be written <br />. Then there was one misplaced closing div and another one missing, that was all, I think.
You can see in the code that I have put in comments about which closing div belongs to which opening ones, and that is a good practice to follow, then otherwise it's very easy to get lost in the divs.
The code:
The errors that caused those images to appear twice were these lines:
<A HREF="http://www.njsmpa.org/resources.php"><div id="resources-img">
Resources</a> </div>
Resources</a> </div>
and
<A HREF="http://www.njsmpa.org/president.php"><div id="president-img">
From the President</a> </div>
From the President</a> </div>
You can't have a div inside a a href, so as soon as I moved the divs in front, like this:
<div id="resources-img"> <a href="http://www.njsmpa.org/resources.php">
Resources</a> </div>
Resources</a> </div>
and similar with the other one, then the 'stereo effect' disappeared.
The other errors in the coding were mainly due to your using the doctype xhtml strict, but hadn't taken into account that all the coding then has to be in lowercase, and the self closing tags, such as e.g. <br> will have to be written <br />. Then there was one misplaced closing div and another one missing, that was all, I think.
You can see in the code that I have put in comments about which closing div belongs to which opening ones, and that is a good practice to follow, then otherwise it's very easy to get lost in the divs.
The code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>NJ State Municipal Prosecutors Association</title>
<meta name="description" content="The New Jersey State Municipal Prosecutors' Association ("NJSMPA") came into being in October 2004. The original purposes of the NJSMPA included: addressing and promoting issues facing all municipal court Prosecutors in the State of New Jersey; to take an active role in lobbying for legislation unique to the position of municipal prosecutor; creating continuing legal education courses specific to municipal prosecutors and municipal court issues; promoting camaraderie of like minded individuals and; identifying all municipal prosecutors in the State of New Jersey by completing a census of all municipal courts."/>
<meta name="keywords" content="NJ, New Jersey, NJSMPA, New Jersey State Municipal Prosecutors' Association, Bob Pinizzotto, Attorney, lawyer, firm, tort, litigation, appellate, law firm, civil, criminal, suit, case, jail, accident, punitive, legal, advice, consultation, sue, damages"/>
<link rel="stylesheet" href="http://www.njsmpa.org/style.css" type="text/css" charset="utf-8" />
</head>
<body>
<div id="wrapper">
<div id="header"> </div>
<div id="left">
<div id="logo">
<h1></h1>
<p></p>
</div> <!-- End logo -->
<div id="nav">
<ul>
<li class="important"><a href="http://www.njsmpa.org">Home</a></li>
<li><a href="http://www.njsmpa.org/application.php">Application</a></li>
<li><a href="http://www.njsmpa.org/resources.php">Resources</a></li>
<li><a href="http://www.njsmpa.org/president.php">Message from the President</a></li>
<li><a href="http://www.njsmpa.org/trustees.php">Board of Trustees</a></li>
<li><a href="http://www.njsmpa.org/cpp.php">Certified Prosecutor Program</a></li>
<li><a href="http://www.njsmpa.org/members/members.php">Members Area</a></li>
<li><a href="http://www.njsmpa.org/contact_main.php">Contact us</a></li>
</ul> </div> <!-- End nav -->
<div id="news">
<h2>Latest News</h2>
<p><b>96th Annual<br />NJ State League of<br /> Municipalities Conference
</b>
<br />November 15,16,17<br />
Atlantic City<br />
Convention Center
<br />
<a href="http://www.njsmpa.org/league_conference.php">Click here</a> for more info<br /><br />
<b>Quarterly Meeting Dates</b><br />
Friday, Sept. 23, 2011 @ 1pm<br />
Groveville Fire Station<br />
4201 Crosswicks Ham Sqr Rd<br />
Hamilton, NJ.<br /><br />
Wednesday, Nov. 16 @ 1pm<br />
NJ State League<br />
of Municipalities Conference<br />
Atlantic City<br />
Convention Center
<br /><br />
<b>Notice to the Bar<br />regarding Municipal<br />Court Trial Certification
</b><br />
More Info .. <a href="http://www.njsmpa.org/trial_certification.php">Click Here</a>
</p> <div class="hr-dots"></div>
</div> <!-- End news -->
<div id="contact">
<br /><br /><br /><br /><br />
<p class="right"><a href="contact.php">Email the NJSMPA</a></p>
</div> <!-- End contact -->
</div> <!-- End left -->
<div id="right">
<h2>Welcome to the NJSMPA</h2>
<div id="welcome">
<img src="images/pic_1.jpg" width="171" height="137" alt="Pic 1" class="left" />
<p>The New Jersey State Municipal Prosecutors Association (NJSMPA) was organized in 2004 for the purpose of providing a collective voice for the municipal prosecutors of New Jersey.</p>
<p>Since our founding, we have also provided our membership with professional development opportunities, and a sense of camaraderie amongst municipal prosecutors.</p>
<p class="more"><a href="http://www.njsmpa.org/president.php">more</a></p>
</div> <!-- End right -->
<h3>Organization Profile and Resources</h3>
<div id="profile">
<div id="resources">
<div id="resources-img"> <a href="http://www.njsmpa.org/resources.php">
Resources</a> </div> <!-- End resources img -->
<p>Resources and links of interest for our visitors that can prove to be a valuable resource.</p>
</div> <!-- End resources -->
<div id="president">
<div id="president-img"> <a href="http://www.njsmpa.org/president.php">
From the President</a>
</div> <!-- End president img -->
<p>A special welcome message from our President, Jon-Henry Barr, Esq.</p>
</div><!-- End president -->
</div> <!-- End profile -->
<div class="clear"> </div>
</div> <!-- End wrapper -->
<div class="clear"> </div>
<div id="spacer"> </div>
<div id="footer">
<div id="copyright">
Copyright © New Jersey State Municipal Prosecutors Association, All right reserved.
</div> <!-- end copyright -->
<div id="footerline"></div>
</div> <!-- end footer -->
</div>
</body>
</html>
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>NJ State Municipal Prosecutors Association</title>
<meta name="description" content="The New Jersey State Municipal Prosecutors' Association ("NJSMPA") came into being in October 2004. The original purposes of the NJSMPA included: addressing and promoting issues facing all municipal court Prosecutors in the State of New Jersey; to take an active role in lobbying for legislation unique to the position of municipal prosecutor; creating continuing legal education courses specific to municipal prosecutors and municipal court issues; promoting camaraderie of like minded individuals and; identifying all municipal prosecutors in the State of New Jersey by completing a census of all municipal courts."/>
<meta name="keywords" content="NJ, New Jersey, NJSMPA, New Jersey State Municipal Prosecutors' Association, Bob Pinizzotto, Attorney, lawyer, firm, tort, litigation, appellate, law firm, civil, criminal, suit, case, jail, accident, punitive, legal, advice, consultation, sue, damages"/>
<link rel="stylesheet" href="http://www.njsmpa.org/style.css" type="text/css" charset="utf-8" />
</head>
<body>
<div id="wrapper">
<div id="header"> </div>
<div id="left">
<div id="logo">
<h1></h1>
<p></p>
</div> <!-- End logo -->
<div id="nav">
<ul>
<li class="important"><a href="http://www.njsmpa.org">Home</a></li>
<li><a href="http://www.njsmpa.org/application.php">Application</a></li>
<li><a href="http://www.njsmpa.org/resources.php">Resources</a></li>
<li><a href="http://www.njsmpa.org/president.php">Message from the President</a></li>
<li><a href="http://www.njsmpa.org/trustees.php">Board of Trustees</a></li>
<li><a href="http://www.njsmpa.org/cpp.php">Certified Prosecutor Program</a></li>
<li><a href="http://www.njsmpa.org/members/members.php">Members Area</a></li>
<li><a href="http://www.njsmpa.org/contact_main.php">Contact us</a></li>
</ul> </div> <!-- End nav -->
<div id="news">
<h2>Latest News</h2>
<p><b>96th Annual<br />NJ State League of<br /> Municipalities Conference
</b>
<br />November 15,16,17<br />
Atlantic City<br />
Convention Center
<br />
<a href="http://www.njsmpa.org/league_conference.php">Click here</a> for more info<br /><br />
<b>Quarterly Meeting Dates</b><br />
Friday, Sept. 23, 2011 @ 1pm<br />
Groveville Fire Station<br />
4201 Crosswicks Ham Sqr Rd<br />
Hamilton, NJ.<br /><br />
Wednesday, Nov. 16 @ 1pm<br />
NJ State League<br />
of Municipalities Conference<br />
Atlantic City<br />
Convention Center
<br /><br />
<b>Notice to the Bar<br />regarding Municipal<br />Court Trial Certification
</b><br />
More Info .. <a href="http://www.njsmpa.org/trial_certification.php">Click Here</a>
</p> <div class="hr-dots"></div>
</div> <!-- End news -->
<div id="contact">
<br /><br /><br /><br /><br />
<p class="right"><a href="contact.php">Email the NJSMPA</a></p>
</div> <!-- End contact -->
</div> <!-- End left -->
<div id="right">
<h2>Welcome to the NJSMPA</h2>
<div id="welcome">
<img src="images/pic_1.jpg" width="171" height="137" alt="Pic 1" class="left" />
<p>The New Jersey State Municipal Prosecutors Association (NJSMPA) was organized in 2004 for the purpose of providing a collective voice for the municipal prosecutors of New Jersey.</p>
<p>Since our founding, we have also provided our membership with professional development opportunities, and a sense of camaraderie amongst municipal prosecutors.</p>
<p class="more"><a href="http://www.njsmpa.org/president.php">more</a></p>
</div> <!-- End right -->
<h3>Organization Profile and Resources</h3>
<div id="profile">
<div id="resources">
<div id="resources-img"> <a href="http://www.njsmpa.org/resources.php">
Resources</a> </div> <!-- End resources img -->
<p>Resources and links of interest for our visitors that can prove to be a valuable resource.</p>
</div> <!-- End resources -->
<div id="president">
<div id="president-img"> <a href="http://www.njsmpa.org/president.php">
From the President</a>
</div> <!-- End president img -->
<p>A special welcome message from our President, Jon-Henry Barr, Esq.</p>
</div><!-- End president -->
</div> <!-- End profile -->
<div class="clear"> </div>
</div> <!-- End wrapper -->
<div class="clear"> </div>
<div id="spacer"> </div>
<div id="footer">
<div id="copyright">
Copyright © New Jersey State Municipal Prosecutors Association, All right reserved.
</div> <!-- end copyright -->
<div id="footerline"></div>
</div> <!-- end footer -->
</div>
</body>
</html>
Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Captain Ron
Registered User
210 posts
Thanks Inger I will apply the changes when I get to my other computer later!
Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.
