IE/Firefox Issues

[ArmoVanBuuren]

Finally got the calendar integrated into the site now all my css has gone wrong it appears how i want it to be in firefox but totally different in ie, the whole of the site is in the left hand corner and not in the middle how it should be. The calendar is also below the whole of the page and not in the centre of navigtion and header like it should be.

My site is here

If anyone could give me any pointers as i am sure it is a quick job to fix then let me know, i can email you the source if you would like.

Please pleae help me

 

[ArmoVanBuuren]

Still strugglin with this problem, would really appreciate it if someone could help me out. I get two different views of my site, get the correct view in firefox

But in Internet Explorer I the whole layout moves to the right and the calendar in the article <div> goes below the whole layout. I have enclosed the css at the bottom.


The website address is www.toonight.co.uk

The calendar is Calendar Express 2 and is made from tables.

Here is a similar website that was on php lites homepage with a similar layout to what i need.

If anyone could help me out it would be greatly appreciated and there may be a small gift if u could help me out

body {
	margin: 0 auto;
	padding: 0;
	font-family: Arial, Verdana, Sans-Serif;
	font-size: 9pt;
  background-color: #BDE3F9;
}

a {
	text-decoration: none;
	color: #2489DB;
}

a:hover {
	color: #808080;
}

a img {
	border: 0;
}

h3 {
	font-size: 1.3em;
	margin: 0 0 5px 0;
	padding: 2px 0px 0px 0px;
}

#bg { 
	width: 760px;
	margin: 0 auto;
	padding: 5px 10px 10px 10px;	
}


#content {
	padding-top: 9px;
	color: #303030;
	width: 700px;
	padding-left: 2px;
	
}

#toplinks {
	height: 20px;
	background: #2489DB;
	text-align: right;
	padding-right: 10px;	
	padding-top: 5px;
}

#toplinks a {
	font-size: 8pt;
	display: inline;
	padding-left: 8px;
	padding-right: 5px;
	background: url(strelica.gif) left no-repeat;
	padding-bottom: 3px;
	margin-right: 5px;
	color: #fff;
}

#toplinks a:hover {
	border-bottom: 2px solid #fff;	
}

#title {
	clear: both;
	margin: 0px 0px 0px 0px;
	height: 91px;
	width: 700px;
	background: url(banner.gif) /*repeat-x*/;
}

#navigation {
	clear: left;
	float: left;
	width: 150px;
	margin: 0 0 10px 0;
	padding: 0;
	font-size: 0.9em;
	background: url(navbar1.gif) top left no-repeat;
	height: 375px;
}

#navigation ul {	
	list-style: none;
	width: 150px;
	margin: 0 0 3px 0;
	padding: 0;
	font-size: 1.1em;
}	

#navigation li {
	margin-bottom: 4px;
}

#navigation li a, #navigation li a:visited {
	text-align: right;
	height: 20px;
	text-decoration: none;
	color: #fff;
	display: block;
	padding: 6px 8px 0 10px;
	background: #2489DB;
}	
	
#navigation li a:hover {
	background: #A9CAEB;
	color: #286ea0;
}

#recent_articles {
	float: right;
	width: 223px;
	margin: 0 0 10px 0;
	padding: 5px 13px 20px 10px;
	border: 2px solid #DDD;
	color: #5D5D5D;
	line-height: 1.5em;
	background-color: #FFFFFF;
}

#recent_articles p {
	margin: 0px;
	font-size: 90%;
}

#recent_articles h3 {
	font-size: 9pt;	
}

#recent_articles a {
	display: block;
	height: 12px;
	padding-bottom: 4px;
	margin-bottom: 2px;
	border-bottom: 1px solid #ccc;
}

#author {
	margin: 15px 0 0 0;
	border: 2px solid #fff;
	padding: 3px 3px 3px 6px;
	color: #70C256;
	border: 2px solid #DDD;
}

#author a, #author a:visited {
	display: inline;
	border: none;	
}

#article {
  
  border: 1px solid #000000;
  width: 700px;
  background-color: #BDE3F9;
	margin:  5px 0px 5px 0px;
	/*padding: 0px 0px 5px 6px;*/
	line-height: 1.4em;
}

/*#article h2 {
	margin: 0px;
	padding: 4px 0px 4px 0px;
	font-size: 10pt;
	font-family: Verdana, Arial, Sans-Serif;
}*/

/*#article p {
	margin: 0px;
	font-family: Arial, Verdana, Sans-Serif;
	font-size: 9pt;
}*/