More on CSS - Questions

Speaker Notes

Slide 1:

This presentation is full of frustration. Try the samples in Explorer, try them in Navigator - some of them will work in both, some in neither and some in one of them!

The promise is there, but there are miles to go...

Slide 2:

Picture of screen in Netscape with three overlapping images.

Works for me in both Netscape and Explorer.

Slide 3:

This is overabs.html.

This is the whole - on the next slide I have broken it down and will talk about the parts. If the next slide isn't clear on what goes where, refer back to this.

Slide 4:

Read more about positioning in one of the resources for CSS.

Note: In this example the reference to the images is done with ID, in the next example it is done with CLASS.

Slide 5:

This is the full code. On the next slide it is broken up and analyzed.

Note that images have height and width because I am looking for a specific size to go with the absolute placement.

Remember also that specifying height and width makes images load more rapidly.

Slide 6:

CLASS is used here to define the style for the DIV and therefore the image within the DIV.

Please be sure to read about CLASS, DIV, ID etc. in a source for CSS information.

Slide 7:

Be sure to check all style elements in both Netscape and Explorer - you will see some differences.

Slide 8:

This needs to also be tested with Explorer and Navigator. The support varies.

Note: I also had problem with background-position when I tried other things like right and bottom - again Explorer 5.0 supported the feature better than Navigator 4.6 - I have not yet tested with Navigator 4.7.

Slide 9:

TOFLOAT has also picked up the information from DIV since it is within division.

The float:right puts the specified text to the right and lets the other text float around it. The same is down with an image in the example.

Slide 10:

Check the float in this example in both Explorer and Navigator. The results are different.