works fine in firefox =(

justinh · December 12, 2008

Well I'm working on a file upload program. I'm designing the login page right now, everything is perfect in Firefox ( my best friend ) but ofcourse, IEXPLORE screws everything up =(

www.wmptest.com/stbs/index.html

and here is the css


body {
background-color: #336699;
}

#container {
background-color: white;
border: 2px;
border-style: solid;
border-color: black;
margin-left: auto;
margin-right: auto;
margin-top: 200px;
padding: 0px 5px 0px 0px;
width: 340px;
height: 250px;
}

img {

float: left;

}

#content {

width: 200px;
height: 153px;
float: left;
background-color: white;
}

legend {

font-family: arial;
}

label {
font-size: 12px;
font-family: arial;
margin-right: 5px;
}

input {


border-color: #336699;
border-style: solid;
}

input:focus {

border-color: #0E3D6C;

}

.submitbutton {

margin-top: 5px;
margin-left: 90px;
margin-bottom: 5px;
}

#copyright {

font-size: 8px;
text-align: center;
font-family: verdana;
}

fieldset {

margin-left: auto;
margin-right: auto;
padding: 0px 20px 5px 20px;
}

any help would be greatly appreciated.

dbrimlow · December 13, 2008

There is so much wrong, here.

First, you are not using a doctype or charset at all .... pure 100% "Quirks" mode!

1. NEVER start a page with just the <html> tag - that's '90s html and old browser technology.

2. ALWAYS use both a real doctype (start with using a "strict" doctype now to get out of bad old html coding habits):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/DTD/strict.dtd">

3. ALWAYS designate the charset - you are asking for trouble when you make the browser guess what characters should be displayed, "unicode", western latin, etc?

Unicode

<meta http-equiv="content-type" content="text/html;charset=utf-8">

or

Western latin:

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

Second, you are floating uncontained elements (images), and not clearing them properly.

You cannot float uncontained elements willy nilly and expect the page to look the same in IE AND modern browsers ... particularly in quirks mode.

They need to be properly contained and cleared. You can contain them in paragraphs (text and images) or divs (for images, not text). Then make certain the element is cleared where necessary.

Sign In

works fine in firefox =(

Recommended Posts

justinh

Link to comment

Share on other sites

dbrimlow

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information