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/

Reply via email to