Layout gone funny ?

[Pazza]

Hey,

This is the css for it :

@charset "utf-8";
/* CSS Document */
body {
  text-align: center;
  background-color: #ffffff;
  font-family: Verdana;
  font-size: 10px;
  font-weight: normal;
  color: #000000; 
  }

#wrapper {margin-left:auto;
         margin-right:auto;
		 width:796px;
		 }
		 
#header  {background-image:url(images/header.png);
          margin-top:0;
		  width:796px;
		  height:126px;
		  }
		
#undernav {background-image:url(images/rightundernav.png);
           width:222px;
		   height:29px;
		   float:right;
		   }
		   
#maintop {background-image:url(images/maintop.png);
          width:574px;
		  height:14px;
		  float:left;
		  }
#mainmid {background-image:url(images/mainmid.png);
          width:574px;
		  float:left;
		  min-height:300px;
		  }
#mainbot {background-image:url(images/mainbot.png);
         width:574px;
		 height:4px;
		 float:left;
		 }

#wrapper2 {float:right;
           width:223px;
           margin-top:-289px;
           overflow:hidden;
           display:inline;
           margin-left:574px;
           z-index:1;

	   
		   }
		   		   
#right1top {background-image:url(images/rightheader1.png);
            width:223px;
			height:26px;
			margin-left:-1px;
			}
#right1mid {background-image:url(images/rightmid1.png);
            width:223px;
			min-height:50px;
			margin-left:-1px;
			}
#right1bot {background-image:url(images/rightbot1.png);
            width:223px;
			height:4px;
			margin-left:-1px;
			}



			  
#right2top {background-image:url(images/rightheader2.png);
            width:223px;
			height:26px;
			margin-left:-1px;
			}
#right2mid {background-image:url(images/rightmid2.png);
            width:223px;
			min-height:50px;
			margin-left:-1px;
			}
#right2bot {background-image:url(images/rightbot2.png);
            width:223px;
			height:4px;
			margin-left:-1px;
			}


			  
#right3top {background-image:url(images/rightheader3.png);
            width:223px;
			height:26px;
			margin-left:-1px;
			}
#right3mid {background-image:url(images/rightmid3.png);
            width:223px;
			min-height:50px;
			margin-left:-1px;
			
			}
#right3bot {background-image:url(images/rightbot3.png);
            width:223px;
			height:4px;
			margin-left:-1px;
			}

Okay, this is it in IE:



And this is it in FF:



So any ideas on whats wrong ?

Everything else expands correctly, but when the main one expands, the others move down ??

+rep for help, i'm trying to learn you see.

[Jamesy]

I think the 1 pixel border thing is to do with some browsers rounding up a half pixel, and some round down.

I don't think there's an easy fix for that, not that I've come across.

[Johno]

Do you have a live version of it? might help a bit more

[Meti]

Do you have a live version of it? might help a bit more

...http://izcool.com/lucas1/