Main body text not showing up sometimes

I've got a wierd problem happening on all my website pages. Sometimes when the pages load, the text on them, which is black, does not show up - but if you click on the page anywhere, or look at a different tabbed page, then back to the website page, the text miraculously shows up.

I checked and double checked all the text colour settings to ensure that the only text colours are black for main text, green for some text and red for warnings and alerts - I'm sure something has been overlooked to be causing this odd text load problem and would really appreciate some advice or suggestions?

Thanks - Kathy.
Website is www.naturalsoap.com.au

What browser are you using?

Hi Kim,

I'm using IE - have tried to view site on both IE 7 and 6, both get the same problem :(

thanks in advance,
Kathy.

What did you use to edit this?

<div id="indexDefaultMainContent" class="content"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css"></style><script type="text/javascript"></script><script src="http://www.google-analytics.com/ga.js" type="text/javascript"></script><script type="text/javascript"></script><font face="verdana,arial,helvetica,sans-serif" size="2"><p class="MsoNormal" style="MARGIN: 0cm 0cm 0pt" align="left"><span style="FONT-SIZE: 8.5pt; COLOR: #2c3e49; FONT-FAMILY: Verdana"><img hspace="0" src="http://www.naturalsoap.com.au/shop/images/botanicals.jpg" align="middle" border="0" /><br /><br />Nestled in the beautiful Hawkesbury Valley of NSW, we at ReVitalize have created a truly luxurious range of natural, handmade soaps and skincare products, unlocking the secret to healthy, radiant skin. Combining some of the most exotic ingredients known in the botanical world, and always of the highest quality, our innovative products can help nourish and care for your skin, the best way possible – naturally. <br /><br /><img hspace="0" src="http://www.naturalsoap.com.au/shop/images/freeship.jpg" align="middle" border="0" /><br /><br /></span><span style="FONT-SIZE: 8.5pt; COLOR: #2c3e49; FONT-FAMILY: Verdana">We invite you to indulge in our exclusively deluxe natural soaps, moisturizing creams, replenishing body lotions and more, each one made with skin loving organic oils, rich nourishing plant butters, traditional skin care herbs and pure essential oils, to help care for your skin while also delighting your senses. Spoil yourself today!<br /><br /><br /><strong><span style="FONT-SIZE: 9pt; COLOR: #66cc66; FONT-FAMILY: Verdana">Christmas Holidays:</span></strong><span style="FONT-SIZE: 9pt; COLOR: #66cc66; FONT-FAMILY: Verdana"> We will be closed from Monday the 22nd of December to the 5th of January, 2009. Orders can still be placed during this time, but they will not be sent out till we re-open. We wish all our customers a very safe and happy Christmas, and a wonderful New Year!<br /><br /></span></span></p></font></div>

It has several html validation errors - Clean it up and I'll bet you have fewer problems.

Hi Kim,

I use DreamWeaver for my editing, since I'm still learning coding I'm not suprised I've messed up somewhere - I knew it would be something I've overlooked or not done correctly lol! How exactly do I 'Clean it up'?

Thanks in advance,
Kathy - www.naturalsoap.com.au

It's going to be very hard for you to get clean, valid code out of Dreamweaver -- or any other visual editor. If you have the latest version, it does a better job than it used to, but still not good. Check its preferences to ensure you're getting the best possible code out of it.

But better yet, learn HTML and CSS so you can edit the code in a text editor.

To clean it up, run the page through a validator -- the one at w3.org is good -- and read the resulting report. Then edit (not in Dreamweaver) the code to fix the problems.

I assume you're using DW to create things like product descriptions and the text you put into the define_pages_editor? If so, make sure you're copying and pasting only the part you need. In the sample that Kim copied above there is a lot of extraneous material above the first bit of useful text.

HTH

Rob

PS
Nice looking site. ;-)

Hi Rob,

Thanks for that :)

I'd been recomended to use dreamweaver from a website developer I know - so had taken his advice as face value.

I'll play with the coding today, so hopefully I can work it all out before I re-open the business on Monday after my xmas break!

Will the wonky html coding that's showing in the define_main_page be what's causing text to not show up on page loads though - that's what I need to make sure is fixed...

Cheers,
Kathy - www.naturalsoap.com.au

kathsta:

Will the wonky html coding that's showing in the define_main_page be what's causing text to not show up on page loads though - that's what I need to make sure is fixed...

Very likely yes, that's the problem. Browsers try hard to deal with bad code, but they have their limits.

Rob

Hi Rob,

I got a copy of a html editor that promised 'clean code' called Altova StyleVison, played with the code and tags that Kim had said needed revision, then had it checked and it came back as fine. I uploaded the correctly laid out (according to the editor I used anyway) up in the define_main_page file, and the problem still occurs on every page - sometimes the text will show, be in the index page, category listings, or product info pages, but most times the normal text does not show up untill you double click in the text area, and voila there it is :(

This is verrrrry frustrating as I don't know what to be doing to fix it.

Cheers,
Kathy

Hmm - my problem seems to be a bug with IE7, as I just went to another comp still using IE6 and everything showed up totally normally. I did some googling on IE7 and dissapearing text, and found that it's a common bug.

So, does anyone know of a CSS code I can add to fix this rotten bug?

Thanks in advance,
Kathy - www.naturalsoap.com.au

Your page still does not validate. It has at least one serious error. This is from the w3.org validator...

Line 141, Column 55: document type does not allow element "html" here.

<div id="indexDefaultMainContent" class="content"><html>

The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

When you create the html code you want to put into define_pages, you can only copy and paste the code between, and not including, the BODY elements.

Rob

Hi Rob,

I've onlt used an editor for the define_main_page layout - all others are only ever done in the online editor from admin. The problem with the text not showing is affecting EVERY page of the website (be it main page, define pages, category listings, product info pages, ezpages etc - ALL pages!) since I changed the template last week, and if I load it in FireFox it works perfectly as it should.

• I have no idea how to fix - I've looked at all pages where the 'indexdefaultmaincontent' is and don't seem to have access to change it so that all pages will at least validate that part corectly?

Getting very frustrated now as the problem with the text still isn't sorted. Thanks for helping thus far...

Cheers,
Kathy - www.naturalsoap.com.au

Whether or not this particular issue is the cause of the white page syndrome, let's fix it.

Go to your main/home page. View Source (in your browser's View menu). A little more than half way down the page, you'll see where the <html> is.

I assume you put that block of text into the main page using the Define Pages Editor. So now go into admin and open the define_main_page.php in the Define Pages Editor, and remove everything above the text you want -- that is, everything from the <html> down to and including the <body> tags. Then scroll down and remove the closing tags for body and html too. Save. Now your main page is fixed.

The other problem -- the missing text -- is usually caused by something like a missing end tag in the PHP somewhere, or missing quotes in define statements (also in the php). And these can be caused by extraneous tags inserted while editing things like product descriptions. Not that tags go missing when you do that, but tags added when you do that can cause the browser to become confused. So if you've used Dreamweaver to create the text you insert into product descriptions, then you may have to go through all of them to weed out the problem code.

What I'd suggest is that you find a page where the problem can reliably be replicated, and check that exact page in the w3.org validator. Then read through its response and try to figure where the problem is coming from. You can ignore warnings, just concentrate on the errors.

Rob

Hi Rob,

Okay I've removed the body and html tages from the define_main_page, but all the other pages as I said in my last message have been edited using the online functions - so the cat descriptions, product info's, ezpages, other define pages, have all been typed and formated through the admin of zencart, so when I go in, there are not additional html or body coding to be removed :(

The problem with missing text has always happened on:
http://www.naturalsoap.com.au/shop/index.php?main_page=index&cPath=69

but when I ran it through the html validator at w3.org it came back totally clear and successfully checked with no errors.

Thanks once again..
Kathy - www.naturalsoap.com.au

Now something else has happened - on my Pampered Skin category, in the product list, the text of the mini descriptions has jumped in size?????

Help lol!
Kathy.

Phew - I just deleted what had been in the cat description and re-typed it back in - now it's still not coming up on the page till you click somehwhere on it, but the listing descriptions are back to their normal size.

Today I re-open after xmas, and my site is still wonky /sigh

Missing text issue FIXED! Since no one here seemed to know how to fix the bug I mentioned, after 2 days of Googling and reading up on different hacks and coding that people have tried to fix this probelm (called the peekaboo bug) I found that the following could be added to the stylesheet, did so, and now my website is working perfectly, so I hope this code helps someone else...

h1, h2, h3, h4, h5, h6, p {
position: relative;
}
*html .centerColumn {
height: 1%;
}

Cheers,
Kathy - www.naturalsoap.com.au

Good work on that, and thanks for posting the solution.

I knew about the 1% trick, but didn't know where to apply it. What always remains a mystery is why some sites have the problem, and some don't. Perhaps only Microsoft knows the answer to that one.

Rob