Javascript Centring Help!!!

  Terrylr 23:03 02 May 2004


I cannot tell you how many people have tried to advise me on this issue ... still to this day no-one has been able to do it.

I have the following html file....

click here

I CANNOT get the javascript text centered in the middle at all!!

Can any amazing person do this?

  PurplePenny 23:35 02 May 2004

You have this instruction in the div id="fader":

position:absolute; top:150px; width:600px;

So you've told it to position itself 150px from the top with a width of 600px. So it is putting itself up against the left edge (the spaces before the first two words are in the text).

  Terrylr 23:44 02 May 2004


thanks for the info... I can understand what you're saying but... replace it with what?

Many Thanks

  PurplePenny 23:53 02 May 2004

In IE the text is in the middle - well at least it is on my screen. In Opera it is over on the left.

I just tried changing that style to:

position:absolute; top:150px; width:100%; text-align:center;

and in Opera it appears almost in the middle of the top of the flag. Unfortunately in IE it appears somewhere over to the right and causes a scroll bar to appear whilst it is on screen.

I can't see the text at all in Mozilla (I wonder if I've diabled JavaScript in Moz.)

I think we'd better wait until one of the experts comes along ..... :-)


  PurplePenny 00:16 03 May 2004


table height="100%" align=center border="0">


table height="100%" width="100%" border="0">

and it works in both Opera and IE. I still cam't see it on Mozilla. I'l just check the alterations I made again cos I changed a couple of other things too but I don't think that they made any difference.

BTW the first two words of text are still slightly over tyhe top of the flag. If you get rid of the height of the table the flag moves up a bit and the words are al nicely inside it.


  PurplePenny 00:21 03 May 2004

I forgot to mention that you still have to do the style alteration.

One other thing whilst you are busy editing - the page title and the alt for the flag both say "offically" (it's correct in the text on the page - you'd have noticed it on there!).

  Terrylr 00:33 03 May 2004

Oh what have I done wrong?! am I going mad?

  Taran 10:31 03 May 2004

Assigning width="100%" to a table tag is illegal HTML.

You can assign it to a cell but should not assign it to a table, and although it works for display purposes it's not really where you should be heading since certain browsers will mangle the page or just completely ignore the centre instruction.

Can you confirm whether you want to have the text over the top of your Union Jack image; as in, overlapping it with the image behind the text, or would you prefer to have the text a line or two above your image, with a gap between the two ?

If you confirm which way you want to go with that I'll give you the code to do it.

I'll check in later and see what your decision is.

  Terrylr 12:40 03 May 2004

Hi Taran,

Thank you for your post.

I would like the text a couple of lines above the union flag. I would also like centered above the flag.

Many many thnaks for your help


  IClaudio 15:38 03 May 2004

doesn't appear at all here, with Firefox (Java enabled), but does with IE.

  Taran 09:32 04 May 2004

I got sidetracked yesterday, so my apologies for not returning to this until now.

Something came to mind and I want to bounce it around before we take things any further.

JavaScript, by it's very nature, relies 100% on a web browser that is JavaScript capable and also that has a recent version of a Java Virtual Machine installed to allow it to handle the scripts.

As has already been pointed out, Firefox doesn't like your JavaScript and I've looked at your page in one or two other browsers only to find that there are problems in many of them.

If you don't care about this and want to proceed with the JavaScript anyway then let me know and we'll go through how to centre the script.

However, I got to thinking...

There are a number of products on the market that allow the rapid creation of small Flash animations, specifically for scrolling banner text and similar. They ship with a variety of templates, they are easy to use, and although I regularly shout out loud against the misuse of Flash (one of my pet hates in the web design world) there are situations where it is not only desirable but far more appropriate than other methods.

Example, on your page I removed all of the JavaScript code completely. A small Flash animation containing your banner text is only a few kb in size and Flash is one of those formats that enjoys very widespread support from almost every browser. I tested the whole lot on my own PC and it works in all browsers.

Anime-FX was an excellent tool for creating Flash banners in a few seconds and now Mix-FX from the same company continues in this light click here

You can download a 30 day trial and, in your case, it would get rid of all JavaScript browser problems with your page and nobody minds a couple of seconds for your page to load a small Flash file.

Another far more capable and far more complex program is SWiSH click here

Again, a trial download is available and this can be used to produce almost anything that Flash can, without doing your head in in the process.

I'm not copping out of your JavaScript problem, it's just that a small Flash file would remove all of the issues you are likely to face by using that script when any other browser than recent versions of IE will go haywire on your page.

products like Mix-FX take literally seconds to generate your banner texts and background effects from various templates. All you do then is copy the files to your web root folder and reference them in your document.

Just a thought.

Let me know if you still want to battle on with your JavaScript, but I feelt aht Flash, in this case, is probably your best bet by far.


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

Print designer Kelly Anna on confident mark making & modern femininity

New iMac Pro release date, UK price & specs rumours

Comment créer, utiliser et supprimer son compte Facebook ?