I have a page that has 4 pics side by side, total width 780px.
They are all in a div called plans, everything displays correctly in FF, however, in IE, the last pic drops down to the next line and that totally breaks the site.
My guess is that it is the difference in the way IE handles measurements.
But can anyone shed any light on how to move that pic back up?
Thanks for looking.
Jim
They are all in a div called plans, everything displays correctly in FF, however, in IE, the last pic drops down to the next line and that totally breaks the site.
My guess is that it is the difference in the way IE handles measurements.
But can anyone shed any light on how to move that pic back up?
Thanks for looking.
Jim
Code:
<div class="plans">
<img src="../MyHT/images/plan1.gif" width="195" height="173" alt="" border="0"><img src="../MyHT/images/plan2.gif" width="195" height="173" alt="" border="0"><img src="../MyHT/images/plan3.gif" width="195" height="173" alt="" border="0"><img src="../MyHT/images/plan4.gif" width="195" height="173" alt="" border="0">
</div>
body {
margin:0px 0px;
padding:0px;
text-align:center;
}
.Content {
width:785px;
margin:0px auto;
text-align:left;
background-color:#fff;
position: relative;
padding-right: 10px;
}
.main_content {
width:780px;
min-height:225px;
background-color:#fff;
border-left: 1px solid #0000ff;
border-right: 1px solid #0000ff;
border-bottom: 1px solid #0000ff;
float: left;
border-top: 0px;
margin-right: 20px;
}
a:link {
text-decoration: none;
}
a:hover {
text-decoration: underline overline;
color: #0000ff;
}
a:visited {
text-decoration: none;
color: #0000ff;
}
a:active {
color: #0000ff;
}
.maintext {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #ffffff;
line-height:16px;
float: left;
margin-right: 20px;
margin-left:150px;
}
.bottom {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #4985BC;
line-height:35px;
}
.headpic {
margin: 0;
float: left;
padding:0;
border-left: 1px solid #0000ff;
border-right: 1px solid #0000ff;
border-top: 1px solid #0000ff;
}
.head2 {
margin: 0;
float: left;
padding:0;
width: 780px;
height: 39px;
background-image: url(../images/index_10.jpg);
border-left: 1px solid #0000ff;
border-right: 1px solid #0000ff;
}
.menu {
color: #0033cc;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
padding-top: 15px;
padding-left: 10px;
font-weight: bold;
float: left;
}
.seperator {
color: #0033cc;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 16px;
padding-top: 14px;
padding-left: 10px;
font-weight: bold;
float: left;
}
.plans {
border-bottom: 1px solid #0000ff;
border-left: 1px solid #0000ff;
border-right: 1px solid #0000ff;
width: 780px;
}
.copy {
border-bottom: 1px solid #0000ff;
border-left: 1px solid #0000ff;
border-right: 1px solid #0000ff;
width: 780px;
min-height: 20px;
font-size: 12px;
font-color: #0000ff;
text-align: center;
vertical-align: middle;
}
.server {
width: 200px;
height: 250px;
align: left;
float: left;
padding-left: 10px;
}