1. Home
  2. Forums Index
  3. Browser Side / CSS 12:29 am May 2, 2026

Forum Moderators: not2easy

Message Too Old, No Replies

duplicating text in "content" div

text duplicating

         

Stooshie

1:29 pm on Jul 22, 2005 (gmt 0)

10+ Year Member



Hi there,

I am getting a very weird behaviour in IE 6.0.

I have a page with the following format: 


<div id="center_holder">
 <div id="content">
 <h1>
 Title
 </h1>
 <h2>
 First Para
 </h2>
 <p>
 Lorem Ipsum ...
 </p>
 <p>
 Lorem Ipsum ...
 </p>
 </div>
</div>

And I have the stylesheets: 


body
{
 font-family: Verdana, Helvetica, Sans-Serif;
 color: #000000;
 font-size: 1.0em;
 text-align: center;
 align: center;
 margin: 0px;
}
p
{
 font-size: 0.9em;
}
#center_holder
{
 position: relative;
 width: 615px;
 text-align: left;
 align: center;
 margin: 0 auto;
 padding: 0px;
}
#content
{
 position: relative;
 width: 615px;
 float: left;
 text-align: justify;
}

What is happening is that the last few lines of the last paragraph are duplicated at the end of the page. The weird thing is it's not an entire paragraph that is duplicated, but from the middle of a sentence to the end of the paragraph.

It does it in print preview mode as well.

Anyone any ideas?

Best regards,

Andrew.

Robin_reala

1:38 pm on Jul 22, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Have you got any comments in your HTML? If so try removing them and see. IE (in certain situations involving floats) will start duplicating blocks of characters if there are comments between the floated elements.

4css

1:39 pm on Jul 22, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



This is a bug in IE. At BigJohn's Site [positioniseverything.net] there is an article on this. Its called the Explorer 6 Duplicate Characters Bug.

jetboy

1:42 pm on Jul 22, 2005 (gmt 0)

10+ Year Member



Yep, this has got to be the freakiest IE bug that I've ever had to deal with. Removing comments between <div>s fixed things for me.

Stooshie

1:50 pm on Jul 22, 2005 (gmt 0)

10+ Year Member



Thanks for that.

However I don't have any comments in my HTML.

Here is the view source output (the original code is php): 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en-GB">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Expires" content="">
<meta http-equiv="pragma" content="no-cache">
<meta name="Author" content="Andrew Wilson">
<meta name="Description" content="">
<meta name="Keywords" content="">
<link rel="schema.DC" href="http://purl.org/dc/elements/1.1/">
<link rel="schema.DCTERMS" href="http://purl.org/dc/terms/">
<meta name="DC.title" lang="en" content="Dundee City Council">
<meta name="DC.creator" content="Andrew Wilson">
<meta name="DC.subject" lang="en" content="R">
<meta name="DC.description" lang="en" content="Dundee City Council">
<meta name="DC.publisher" content="Dundee City Council">
<meta name="DC.contributor" content="">
<meta name="DC.date" content="">
<meta name="DC.format" content="">
<meta name="DC.identifier" scheme="DCTERMS.URI" content="http://www.dundeecity.gov.uk/">
<meta name="DC.source" scheme="DCTERMS.URI" content="">
<meta name="DC.language" scheme="DCTERMS.URI" content="English">
<meta name="DC.relation" scheme="DCTERMS.URI" content="">
<meta name="DC.coverage" scheme="DCTERMS.URI" content="">
<meta name="DC.type" scheme="DCTERMS.DCMIType" content="InteractiveResource">
<title>
Dundee City Council :: Community Centres
</title>
<link rel="stylesheet" type="text/css" href="_css/main_print.css" media="screen">
<link rel="stylesheet" type="text/css" href="_css/main_print.css" media="print">
</head>
<body>
<div id="center_holder">
<div id="topbar">
<div id="topbar_taglines">
<div id="topbar_animation"><img src="_images/header_animation.gif" alt="Image: [Animated Logo]" width="170" height="80"></div>
<div id="topbar_title">Dundee Community Centres</div>
<div id="topbar_subtitle">This is a service provided by the Communities Department</div>
</div>
<div id="topbar_spacer"></div>
<div id="topbar_images">
<span id="topbar_image1" class="topbar_image"><img src="_images/douglas.jpg" alt="Image: [Douglas Community Centre]" width="170" height="111"></span>
<span id="topbar_image2" class="topbar_image"><img src="_images/whitfield.jpg" alt="Image: [Whitfield Community Centre]" width="170" height="111"></span>
<span id="topbar_image3" class="topbar_image"><img src="_images/ardler.jpg" alt="Image: [Ardler Community Centre]" width="170" height="111"></span>
<span id="topbar_image4" class="topbar_image"><img src="_images/menzieshill.jpg" alt="Image: [Menzieshill Community Centre]" width="170" height="111"></span>
</div>
<div id="topbar_separator">
<hr>
</div>
</div>
<div id="menu">
<a href="index.php" id="menu_ardler" class="menu_item">Ardler</a><br>
<br>
<a href="index.php" id="menu_charleston" class="menu_item">Charleston</a><br>
<br>
<a href="index.php" id="menu_douglas" class="menu_item">Douglas</a><br>
<br>
<a href="index.php" id="menu_finhill" class="menu_item">Finhill</a><br>
<br>
<a href="index.php" id="menu_greylodge" class="menu_item">Grey Lodge</a><br>
<br>
<a href="index.php" id="menu_highwayman" class="menu_item">Highwayman</a><br>
<br>
<a href="index.php" id="menu_kirkton" class="menu_item">Kirkton</a><br>
<br>
<a href="index.php" id="menu_menzieshill" class="menu_item">Menzieshill</a><br>
<br>
<a href="index.php" id="menu_wac" class="menu_item">WAC</a><br>
</div>
<div id="content">
<h1>
Lorem Ipsum Title
</h1>
<h2>
First ipsum dolor sit amet, consectetuer adipiscing elit. Quisque semper. Nulla tincidunt, neque non volutpat posuere, felis elit faucibus dolor, nec blandit ligula ipsum eget quam. Cras posuere semper nunc. Etiam rhoncus. Suspendisse vel metus ut dui ultricies nonummy. Phasellus mollis venenatis pede. Suspendisse potenti. Morbi purus. Pellentesque nonummy viverra ante. Mauris ultricies lectus at nunc. In hac habitasse platea dictumst. 
</h2>
<p>
<img src="_images/ardler.jpg" alt="Image: [Ardler Community Centre]" width="170" height="111" class="content_image_left">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque semper. Nulla tincidunt, neque non volutpat posuere, felis elit faucibus dolor, nec blandit ligula ipsum eget quam. Cras posuere semper nunc. Etiam rhoncus. Suspendisse vel metus ut dui ultricies nonummy. Phasellus mollis venenatis pede. Suspendisse potenti. Morbi purus. Pellentesque nonummy viverra ante. Mauris ultricies lectus at nunc. In hac habitasse platea dictumst. 
</p>
<p>
<img src="_images/ardler.jpg" alt="Image: [Ardler Community Centre]" width="170" height="111" class="content_image_right">
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed est libero, mollis vel, elementum a, vulputate sit amet, sem. Proin iaculis augue vel tortor. Mauris vel est. Proin in orci a sapien sagittis facilisis. Donec tincidunt risus quis pede porttitor bibendum. In hac habitasse platea dictumst. Mauris pellentesque, dolor et eleifend mattis, justo est hendrerit tellus, eget semper pede lorem ut ligula. Sed tortor tortor, placerat eu, consequat sit amet, cursus rhoncus, tellus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Suspendisse potenti. Fusce eget neque. Morbi malesuada odio ac turpis. Ut hendrerit dolor molestie urna. Sed ac purus vel elit ullamcorper vehicula. Integer placerat, arcu quis rhoncus feugiat, orci orci ullamcorper lorem, vulputate dapibus nulla quam non diam. Phasellus hendrerit tortor pulvinar elit. Sed massa ligula, eleifend ut, porta nec, ullamcorper eget, pede. Mauris mollis dolor at nunc. 
</p>
</div>
<div id="bottombar" class="bottombar">
<hr class="hr_bottombar">
</div>
<div id="validators">
<a href="http://validator.w3.org/check?uri=referer"><img border="0" src="http://www.w3.org/Icons/valid-html401" alt="Valid HTML 4.01!" height="31" width="88"></a>
<a href="http://jigsaw.w3.org/css-validator/"><img border="0" src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Valid CSS!" height="31" width="88"></a>
</div>
</div>
</body>
</html>

Thanks again.

Best regards,

Andrew.

4css

2:14 pm on Jul 22, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



did you read the article? There are also a few other causes, if you read down the article, there is a link to a site where other things could also cause the same bug.

Stooshie

2:23 pm on Jul 22, 2005 (gmt 0)

10+ Year Member



Hi there,

Sorry, missed the link.

I do have some display:none styles on elements.

The stylesheet I am working on will eventually be for media="print" so I do need to have the display:none styles for the non-printable elements.

I will see what I can do.

Best regards,

Andrew.

Stooshie

2:27 pm on Jul 22, 2005 (gmt 0)

10+ Year Member



Hi there, 


 margin: -3px;
 width: (mywidth+3)px;

seems to fix it.

Thanks again for your help.

Best regards,

Andrew.

4css

2:34 pm on Jul 22, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I'm happy to see it worked for you. I was going to post the -3px thing, but sometimes it is better to read the article.

Have a good one!

 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

  1. Home
  2. Forums Index
  3. Browser Side / CSS 12:29 am May 2, 2026