DHTML Lab - dhtmlab.com - Dynamic Headline Fader, Version 2.01 | 13

Dynamic Headline Fader, Version 2.01
the IE4 width problem

The Problem

When viewing the fader in Explorer 4 (all platforms) the fader changes size when displaying items of varying length. This is especially visible if the fader has been given a background color or border.

In order for an element to have a fixed width and height, a width value must be assigned at the time of element creation. This behavior has changed in Explorer 5.

That is, we cannot dynamically change or assign a width value to an element's style, after element creation, unless a width value, any value, already exists. This value can be a dummy value, but it must be assigned at the time of element creation.

In Version 2.0 of the fader, we assigned a width and height to the fader dynamically, after page load. Thus, we had the resize problem.

The Solution

We can assign a dummy width, to initialize the property, in the DIV tag:

<DIV ID="elFader"
     STYLE="position:relative;visibility:hidden;width:100;">
</DIV>

or:
<DIV ID="elFader"
     STYLE="position:absolute;visibility:hidden;width:100;">
</DIV>

This in no way harms sizing or execution by Expolorer 5 or Navigator.

Relative vs. Absolute Positioning

Explorer 4 also has problems with the text-align property. It can't decide whether to justify the element, the element's contents, or both. This confusion has been fixed in Explorer 5, where only the contents are justified.

The reasons for the text-align problem will not be discussed here, but it may affect the fader, especially if you assign a position value of relative.

Tip for better IE4 rendering:
Use position:relative sparingly. It is highly recommended that you use it only when the fader is placed within a table cell.

Now, on to more problems.

Produced by Peter Belesis and

All Rights Reserved. Legal Notices.
Created: Sep 21, 1999
Revised: Sep 21, 1999

URL: https://www.webreference.com/dhtml/column25/addendum1/fdr201width.html