I have done some searching and head scratching over this one for a couple of days now. I have the following;
/* header */ #header { position: fixed; height: auto; } #header div.left { background-image: url(../grfx/1280_header_left_anim_out_only.gif); background-repeat: no-repeat; float: left; width: 270px; height: 165px; } #header div.right { background-image: url(../grfx/1280_header_right.gif); background-repeat: no-repeat; height: 165px; margin-left 270px; padding: 0; } /* hide from other browsers \*/ * html .left {margin-right: -3px;} * html .right {margin-left: 0;} /* end hide */ Now, this probably demonstrates my amateur status with CSS, even though I have been using it for several years now, I am no guru. Anyhow, without the "hide from other browsers" section in IE there is a 3px gap between the left and the right image. (I have the images as backgrounds because other items will be placed in front of them). In Mozilla the right image doesn't show up at all. Am I doing something terribly wrong where lining up two images is concerned? I would like to do it without tables and I would like it to look fine in a majority of browsers....is that asking too much? I feel like such an id10t at this point. ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/