No replies
tirinsplay
Offline
newbie
Last seen: 5 years 39 weeks ago
Joined: 2008-07-15
Posts: 1
Points: 0

Check out the following.

The font size of .9em in the *-header DIVs causes the specified width to be "ignored." When the font size is removed, the alignment with the subsequent input fields (and width) is correct. It renders incorrectly in FF 3.0 and IE 6.0. Any ideas?

body {
margin: 0;
padding: 0;
font-family: "Avant Garde", Verdana, sans-serif;
font-size: 62.5%;
color: "Royal Blue";
background-color: #FFFFFF;
vertical-align: baseline;
}
#main {
width: 72em;
background-color: #669999;
}
input {
margin: 0;
padding: 0;
}

.col-left {
float: left;
width: 14em;
margin-bottom: .6em;
background-color:#00CC33;
}
.col-middle {
float: left;
width: 14em;
margin-left: .8em;
margin-bottom: .6em;
background-color:#33CCFF;
}
.col-right {
float: left;
width: 14em;
margin-left: .8em;
margin-bottom: .6em;
background-color:#CC6666;
}
.col-left-header {
float: left;
width: 14em;
height: inherit;
margin-bottom: .3em;
font-size: 0.9em;
background-color:#00CC33;
}
.col-middle-header {
float: left;
width: 14em;
height: inherit;
margin-left: .8em;
margin-bottom: .3em;
font-size: 0.9em;
background-color:#33CCFF;
}
.col-right-header {
float: left;
width: 14em;
height: inherit;
margin-left: .8em;
margin-bottom: .3em;
font-size: 0.9em;
background-color:#CC6666;
}

Form Failuer

First_Name
Middle
Last_Name