Disappearing text

  The one and only Mr A 23:22 24 Jun 2005

I'm a relative novice at web design but have recently put together for a friend who runs asnooker club with Dreamweaver. It all looks quite nice on my computer but when you view it on the net the text below a certain level dissappears after the page finish loading. Can anyone give me pointers on how to sort this out? I've done the site more or less from scratch again only to encounter the same problem :(

The page is at click here

Thanks in advance!

  Forum Editor 23:41 24 Jun 2005

I think you're using a template aren't you? If so you may need to adapt it for your use - I suggest that you insert some tables, and layout your text that way.

In addition, I would tweak the font size up a point. Your Contact page font differs from the other pages - you might want to rectify that.

  Eric10 12:33 25 Jun 2005

I can tell you what is causing the problem but not why. The problem is with the navigation links. On the Home page the lower text is visible until you run the cursor over the other links and returns when you hover over the Home button again. On the "Competions" and "Roll of Honour" pages the lower text again becomes visible when hovering over the Home button.

This led me to the style sheet and I have found that if the backgroung-color is disabled in the "#sectionLinks a:hover" section then the problem disappears. Unfortunately this means that the background colour of the link doesn't change when hovered over but that is surely a lesser problem than the one you have got at the moment. If you change the appropriate part of your style sheet to that listed below it will correct your immediate problem and just change the text colour of the link to a darker blue so as to give a different effect when hovered over.

#sectionLinks a:hover {

border-top: 1px solid #cccccc;

/* background-color: #dddddd; */


padding: 2px 0px 2px 10px;


I offer this as a workaround since I have no idea why the background-color should cause this. Perhaps someone with a better understanding of CSS can explain it.

  Forum Editor 14:58 25 Jun 2005

I hadn't noticed that the 'under construction' line of text disappears when you hover on the side nav bar links - and reappears when you hover on the 'home' link.

  Eric10 16:24 25 Jun 2005

Again I don't know why this works but the top line of each of your pages start:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"click here">

If you change this by removing the "click here" part so that each page starts:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

then it all works as intended without changing the stylesheet. Don't forget to include the closing angle bracket at the end of the first line. I've seen this on other websites but can't explain it.

  Eric10 16:27 25 Jun 2005

Caught out again. The two instances of click here should read "http: // www. w3. org/TR/html4/loose.dtd" but without any spaces.

  PurplePenny 23:41 25 Jun 2005

It only happens to text that is lower down the page than the navigation (I had to enlarge the text twice to make it happen).

It doesn't happen in Firefox or Opera, even if the text is lower down the page.

I think that it is an IE problem: I'm sure I've seen the disappearing text problem demonstrated but I can't remember where. Sadly I can't remember what the solution was either.

Missing out the URL switches IE into Quirks mode - which means that it will display the page correctly even if it encounters non-standard code. You may not feel ready to know more about that thorny subject but if you do you can read about it here:

click here

  PurplePenny 00:02 26 Jun 2005

I don't really understand why switching IE into Quirks Mode would make the page work. There isn't anything non-standard in your source; I just ran your home page through the W3C validator (a great way to pin down problem code) and the only thing stopping it being valid code was the absence of an "alt" for your image.

It must be that IE is taking the size of the viewing area from the height of the navigation area. You could test that out by putting in lots of fake links (just cut and paste the existing ones a few times) and see whether that stops it happening. At least then you would know what the cause was.

I wonder whether sticking a height: 100% into the style sheet for the navigation div would help. I'd try it out for you but I've got a busy day's DIY tomorrow so I need to get to bed!

  Eric10 10:59 26 Jun 2005

Well done PurplePenny. I've just tried your idea and added "height:100%;" to the "#navBar" section of the style sheet and it worked straight away. So there's your answer Mr A, just add the height instruction to your style sheet and it will be reflected through the whole site.
Looking at your unchanged site again, with the hindsight of PurplePenny's contribution, it is now obvious that it is text on the page that falls belows the bottom of the NavBar that disappears so his solution is quite logical.

This thread is now locked and can not be replied to.

Elsewhere on IDG sites

AMD Radeon Adrenalin release date, new features, compatible graphics cards

6 great UX design talks you can watch online

How to jailbreak an iPhone or iPad in iOS 11 or iOS 10

Musique de Noël : les meilleures chansons en streaming