More CSS Disappointments

The HTML produced was basically just a couple of nested tables. I started experimenting with CSS2, but ran into - surprise, surprise - more browser bugs. Ideally, I was shooting for a "frame" surrounding a table, in a manner something like this (the link is missing for simplicity):

  <DIV style="align: right; width: 83; height: 114; background: #0000ff;">
   <SPAN style="align: center; vertical-align: center;">
    <img src="thumbs/mypic-t.jpg" width=67 height=98 alt="title here" border=0>
   </SPAN>
  </DIV>

Unfortunately, Internet Explorer trips up on the SPAN-inside-a-DIV. Even if you change the SPAN to a DIV, MSIE also doesn't support the vertical-align setting of "middle", which made it impossible to definitively center the picture within the frame. So then I tried this:

  <DIV style="float: right; background: #0000ff;">
   <DIV style="margin: 8pt;">
    <img src="thumbs/jolene-t.jpg" width=67 height=98 alt="foo" border=0>
   </DIV>
  </DIV>

This works in IE, but falls just a little short in Netscape. The Web Review CSS Guide reports: "Navigator does fairly well [with margin properties] so long as margins are not applied to floating or inline elements, in which case major bugs can be tripped." Sure enough, the right margin setting is completely ignored, whether set directly with "margin-right", or implicitly using "margin".

CSS for positioning? Maybe next year.

(continued)

Copyright © 2001
Last updated: 29 Oct 2001 20:10:51