IE format

[lucianvibe]

Can someone please help.

My website loads fine in FF but when I try testing it in IE the sections are all over the page.
The address is http://itcentre.tvu.ac.uk/~20267346/index.php

Thanks in advance.

Lucianvibe

[alex57]

you will need to show your stylesheet to get any further help with this.

[_Aerospace_Eng_]

The large left margin doesn't work in IE when the element has a width and next to a floated element. It will push the element down which you see now. Use this instead
#content {
margin:10px 60px 10px 20px;
padding:0;
line-height:1.1em;
text-align:left;
float:left;
width:638px;
font-size:1.0em;
}
You may need to adjust your left margin and you may need to use clear you floats.

[lucianvibe]

thank you that is sorted out and the content section is now in its proper placce.

The intended format of the site is to be placed in the centre of the screen/page as shown in FF. But IE has it all the way to the left. I thought using
margin-left: auto;
margin-right: auto;
would sort that out but it does not in IE. Any suggestions how I can amend CSS so that webpage is in centre of the screen for FF and IE?

cHEERS

lucianvibe

[lucianvibe]

/* Style body of webpage layout*/
body {
margin:0 auto;
padding:0;
font:76% Verdana,Tahoma,Arial,sans-serif;
background-color: #FFFBC6;
}

/*Style container DIV of webpage layout*/
#container {
background-color: #FFFBC6;
margin:0 auto;
padding:1px 5px;
width: 880px;
margin-left: auto;
margin-right: auto;
}

/*Style header DIV of webpabe layout*/
#header {
height:125px;
margin:0 0 10px 0;
padding:0;
}

/*Style to place borders around page banner*/
#header img {
border-top:1px solid #d8d8d8;
border-right:1px solid #d8d8d8;
border-bottom:1px solid #d8d8d8;
border-left:1px solid #d8d8d8;
}

/*Style navigation section of page*/
#nav {
clear:left;
float:left;
width:150px;
margin:0 0 2px 0;
padding:0;
}

/* Navigation unordered lists*/
#nav ul {
list-style:none;
width:150px;
margin:0 0 20px 0;
padding:0;
}

/*Set margin for navigation list*/
#nav li {margin-bottom:5px}

/*Style navigation links*/
#nav li a {
font-weight:bold;
height:20px;
text-decoration:none;
color:#505050;
display:block;
padding:6px 0 0 10px;
border-top:1px solid #d8d8d8;
border-right:1px solid #d8d8d8;
border-bottom:1px solid #d8d8d8;
border-left:1px solid #d8d8d8;
}

/*Style when mouse is placed (hovered) over navigation link*/
#nav li a:hover{
border-top:1px solid #000000;
border-right:1px solid #000000;
border-bottom:1px solid #000000;
border-left:1px solid #000000;
background-color:#F9C7C2;
}

/*Style to show current page user is on*/
#nav li a.current {
border-top:1px solid #000000;
border-right:1px solid #000000;
border-bottom:1px solid #000000;
border-left:1px solid #000000;
background-color:#F9C7C2;
}

/*Style for notices class or info and notice board*/
.notices {
margin:10px 0 10px 0;
padding:10px 10px 5px 10px;
width:125px;
color:#505050;
height:366px;
border-left:1px solid #d8d8d8;
border-top:1px solid #d8d8d8;
border-right:1px solid #d8d8d8;
border-bottom:1px solid #d8d8d8;
line-height:1.3em;
font-size:0.9em;
}

/*h2 headers in notice board area*/
.notices h3 {margin:0 0 10px 0;padding:0; line-height:0.9em}

/*all links in the notice board area to be bold*/
.notices a {font-weight:bold}

/*Style for links on page*/
a {
text-decoration:none;
color:#505050;
background-color:inherit;
}

/*Style for hovering over links on page*/
a:hover {
color:#3366FF;
background-color:inherit;
}

/*Stlye DIV content of layout*/
#content {
margin:10px 60px 10px 20px;
padding:0;
line-height:1.1em;
text-align:left;
float:left;
width:638px;
font-size:1.0em;
}

#content p {text-align:justify}

#content h2{
font-size:1.6em;
letter-spacing:-1px;
font-weight:normal;
margin:8px 0 10px 0;
padding:0;
}

/*Style DIV footer of layout*/
#footer {
clear:both;
margin:0 auto;
padding:8px 0;
border-top:1px solid #dadada;
text-align:center;
color:#808080;
font-size:0.8em;
}

/*footer paragraph*/
#footer p {
padding:0;
margin:0;
}

[_Aerospace_Eng_]

Get rid any comments or text above the doctype and it will center in IE. IE can't have any output aside from the xml prologue which will cause quirks mode in IE6 but will be fine in IE7 and IE8 but you don't need it so I don't suggest using it.