[welshhuw]

Hi,

I have updated a site at work: www.ladymotor.co.uk/ and the 5 'buttons' (car ins. bike ins. etc) look fine in FF and the same in IE8/7. But my boss and another colleague of mine see it different. The buttons are way out of the design. So I have altered the css for IE and now it looks fine on their pc but not mine?!!

Can you take a look in IE and let me know if the 5 buttons are in the wrong place or not?

And also - How the hell is this occuring??!!??!!


Thanks

[Wickham]

If you want IE and Firefox to look the same (I'm using IE7); delete the #buttons and #contact styles in the IE conditional comment:-

<!--[if IE]>
	<style type="text/css">
		/*#buttons {left:210px;}*/
		/*#contact {top:110px;}*/
	</style>
	<![endif]-->

Add position: relative; in styles.css stylesheet

#main-window {  position: relative;
	border:0px solid #545454;
	width:857px;
	margin:auto;
	margin-top:200px;
	background-color:   #ffffff;
	background-image:url(/images/page-bground.gif);
	background-repeat:repeat-y;
}

and you probably need to edit the left position in the styles.css stylesheet; it looks OK to me over on the left with left: 5px;

#buttons {                        
	position:absolute;
	top:436px;
	left:5px; /*was 291px;*/
	/*background:url(/images/bg-buttons.gif) no-repeat top 

center;*/
	width:557px;
	
}
#contact{
	border: 0px solid #ffffff;     
	position: absolute; top: ??px; /*was 90px; edit to something suitable*/
	margin-left:400px;
	z-index:2;
}

The position: relative for the parent div means that the position: absolute divs take top and left positions from the parent div corner, not the window corner, so the sizes need editing.

See if that helps.