William Grimsley
Reputation: 47
<td style="width:"> Is Not Applying To Internet Explorer 7 And Internet Explorer 5
I have tables on some of my web pages. One part of the table has a style in the title above. On all web browsers except Internet Explorer 7 and Internet Explorer 5, the width above is correct. Whereas, on Internet Explorer 7 and 5 the width is wrong. It is too big.
Thanks,
William
Code for the whole page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type"/>
<meta name="description" content="<#location> weather data"/>
<meta name="keywords" content="Cumulus, <#location> weather data, weather, data, weather station"/>
<meta http-equiv="refresh" content="300"/>
<title><#location></title>
<link href="weatherstyle.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="content">
<h1><#location></h1>
<h2 style="text-align: left; text-transform: none;"> Latitude: 50.70189285 Longitude: -3.30849957 Elevation <#altitude></h2>
<!--[if IE]>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td colspan="3" class="tableseparator_temp">Temperature/Humidity</td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">High Temperature</td>
<td align="center"><#tempTH><#tempunit></td>
<td align="right"><#TtempTH></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Low Temperature</td>
<td align="center"><#tempTL><#tempunit></td>
<td align="right"><#TtempTL></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">High Heat Index</td>
<td align="center"><#heatindexTH><#tempunit></td>
<td align="right"><#TheatindexTH></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Low Wind Chill</td>
<td align="center"><#wchillTL><#tempunit></td>
<td align="right"><#TwchillTL></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">High Apparent Temperature</td>
<td align="center"><#apptempTH><#tempunit></td>
<td align="right"><#TapptempTH></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Low Apparent Temperature</td>
<td align="center"><#apptempTL><#tempunit></td>
<td align="right"><#TapptempTL></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">High Dew Point</td>
<td align="center"><#dewpointTH><#tempunit></td>
<td align="right"><#TdewpointTH></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Low Dew Point</td>
<td align="center"><#dewpointTL><#tempunit></td>
<td align="right"><#TdewpointTL></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Temperature Range</td>
<td align="center"><#temprange><#tempunit></td>
<td align="right"></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">High Humidity</td>
<td align="center"><#humTH>%</td>
<td align="right"><#ThumTH></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Low Humidity</td>
<td align="center"><#humTL>%</td>
<td align="right"><#ThumTL></td>
</tr>
<tr>
<td colspan="3" class="tableseparator_wind">Wind</td>
</tr>
<tr class="td_wind_data">
<td class="main_table_text_labels" style="width: 199px">High Wind Gust</td>
<td align="center"><#wgustTM> <#windunit></td>
<td align="right"><#TwgustTM></td>
</tr>
<tr class="td_wind_data">
<td class="main_table_text_labels" style="width: 199px">High Average Wind Speed</td>
<td align="center"><#windTM> <#windunit></td>
<td align="right"><#TwindTM></td>
</tr>
<tr class="td_wind_data">
<td class="main_table_text_labels" style="width: 199px">Dominant Direction</td>
<td align="center"><#domwindbearing>° <#domwinddir></td>
<td align="right"></td>
</tr>
<tr class="td_wind_data">
<td class="main_table_text_labels" style="width: 199px">Wind Run</td>
<td align="center"><#windrun> <#windrununit></td>
<td align="right"></td>
</tr>
<tr>
<td colspan="3" class="tableseparator_rainfall">Rainfall</td>
</tr>
<tr class="td_rainfall_data">
<td class="main_table_text_labels" style="width: 199px">High Rainfall Rate</td>
<td align="center"><#rrateTM> <#rainunit>/hr</td>
<td align="right"><#TrrateTM></td>
</tr>
<tr class="td_rainfall_data">
<td class="main_table_text_labels" style="width: 199px">High Hourly Rainfall</td>
<td align="center"><#hourlyrainTH> <#rainunit></td>
<td align="right"><#ThourlyrainTH></td>
</tr>
<tr class="td_rainfall_data">
<td class="main_table_text_labels" style="width: 199px">Rainfall Today</td>
<td align="center"><#rfall> <#rainunit></td>
<td align="right"></td>
</tr>
<tr class="td_rainfall_data">
<td class="main_table_text_labels" style="width: 199px">Days Since Last Dry Day</td>
<td align="center"><#ConsecutiveRainDays></td>
<td align="right"></td>
</tr>
<tr class="td_rainfall_data">
<td class="main_table_text_labels" style="width: 199px">Days Since It Last Rained</td>
<td align="center"><#ConsecutiveDryDays></td>
<td align="right"></td>
</tr>
<tr>
<td colspan="3" class="tableseparator_pressure">Pressure</td>
</tr>
<tr class="td_pressure_data">
<td class="main_table_text_labels" style="width: 199px">High Pressure</td>
<td align="center"><#pressTH> <#pressunit></td>
<td align="right"><#TpressTH></td>
</tr>
<tr class="td_pressure_data">
<td class="main_table_text_labels" style="width: 199px">Low Pressure</td>
<td align="center"><#pressTL> <#pressunit></td>
<td align="right"><#TpressTL></td>
</tr>
<tr>
<td colspan="4" class="td_navigation_bar">:<a href="index.htm">Index</a>::<a href="today.htm">Today</a>::<a href="yesterday.htm">Yesterday</a>::<a href="thismonth.htm">This Month</a>::<a href="monthlyrecords.htm">Monthly Records</a>::<a href="thisyear.htm">This Year</a>::<a href="alltimerecords.htm">All Time Records</a>::<a href="trends.htm">Trends</a>:</td>
</tr>
</tbody>
</table>
<![endif]-->
<!--[if !IE]>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td colspan="3" class="tableseparator_temp">Temperature/Humidity</td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">High Temperature</td>
<td align="center"><#tempTH><#tempunit></td>
<td align="right"><#TtempTH></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Low Temperature</td>
<td align="center"><#tempTL><#tempunit></td>
<td align="right"><#TtempTL></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">High Heat Index</td>
<td align="center"><#heatindexTH><#tempunit></td>
<td align="right"><#TheatindexTH></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Low Wind Chill</td>
<td align="center"><#wchillTL><#tempunit></td>
<td align="right"><#TwchillTL></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">High Apparent Temperature</td>
<td align="center"><#apptempTH><#tempunit></td>
<td align="right"><#TapptempTH></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Low Apparent Temperature</td>
<td align="center"><#apptempTL><#tempunit></td>
<td align="right"><#TapptempTL></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">High Dew Point</td>
<td align="center"><#dewpointTH><#tempunit></td>
<td align="right"><#TdewpointTH></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Low Dew Point</td>
<td align="center"><#dewpointTL><#tempunit></td>
<td align="right"><#TdewpointTL></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Temperature Range</td>
<td align="center"><#temprange><#tempunit></td>
<td align="right"></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">High Humidity</td>
<td align="center"><#humTH>%</td>
<td align="right"><#ThumTH></td>
</tr>
<tr class="td_temperature_data">
<td class="main_table_text_labels" style="width: 199px">Low Humidity</td>
<td align="center"><#humTL>%</td>
<td align="right"><#ThumTL></td>
</tr>
<tr>
<td colspan="3" class="tableseparator_wind">Wind</td>
</tr>
<tr class="td_wind_data">
<td class="main_table_text_labels" style="width: 199px">High Wind Gust</td>
<td align="center"><#wgustTM> <#windunit></td>
<td align="right"><#TwgustTM></td>
</tr>
<tr class="td_wind_data">
<td class="main_table_text_labels" style="width: 199px">High Average Wind Speed</td>
<td align="center"><#windTM> <#windunit></td>
<td align="right"><#TwindTM></td>
</tr>
<tr class="td_wind_data">
<td class="main_table_text_labels" style="width: 199px">Dominant Direction</td>
<td align="center"><#domwindbearing>° <#domwinddir></td>
<td align="right"></td>
</tr>
<tr class="td_wind_data">
<td class="main_table_text_labels" style="width: 199px">Wind Run</td>
<td align="center"><#windrun> <#windrununit></td>
<td align="right"></td>
</tr>
<tr>
<td colspan="3" class="tableseparator_rainfall">Rainfall</td>
</tr>
<tr class="td_rainfall_data">
<td class="main_table_text_labels" style="width: 199px">High Rainfall Rate</td>
<td align="center"><#rrateTM> <#rainunit>/hr</td>
<td align="right"><#TrrateTM></td>
</tr>
<tr class="td_rainfall_data">
<td class="main_table_text_labels" style="width: 199px">High Hourly Rainfall</td>
<td align="center"><#hourlyrainTH> <#rainunit></td>
<td align="right"><#ThourlyrainTH></td>
</tr>
<tr class="td_rainfall_data">
<td class="main_table_text_labels" style="width: 199px">Rainfall Today</td>
<td align="center"><#rfall> <#rainunit></td>
<td align="right"></td>
</tr>
<tr class="td_rainfall_data">
<td class="main_table_text_labels" style="width: 199px">Days Since Last Dry Day</td>
<td align="center"><#ConsecutiveRainDays></td>
<td align="right"></td>
</tr>
<tr class="td_rainfall_data">
<td class="main_table_text_labels" style="width: 199px">Days Since It Last Rained</td>
<td align="center"><#ConsecutiveDryDays></td>
<td align="right"></td>
</tr>
<tr>
<td colspan="3" class="tableseparator_pressure">Pressure</td>
</tr>
<tr class="td_pressure_data">
<td class="main_table_text_labels" style="width: 199px">High Pressure</td>
<td align="center"><#pressTH> <#pressunit></td>
<td align="right"><#TpressTH></td>
</tr>
<tr class="td_pressure_data">
<td class="main_table_text_labels" style="width: 199px">Low Pressure</td>
<td align="center"><#pressTL> <#pressunit></td>
<td align="right"><#TpressTL></td>
</tr>
<tr>
<td colspan="4" class="td_navigation_bar">:<a href="index.htm">Index</a>::<a href="today.htm">Today</a>::<a href="yesterday.htm">Yesterday</a>::<a href="thismonth.htm">This Month</a>::<a href="monthlyrecords.htm">Monthly Records</a>::<a href="thisyear.htm">This Year</a>::<a href="alltimerecords.htm">All Time Records</a>::<a href="trends.htm">Trends</a>:</td>
</tr>
</tbody>
</table>
<![endif]-->
<p class="credits"><br />
Page updated <#update format="dd/mm/yyyy hh:mm"><br/>
Powered by <a href="http://sandaysoft.com/products/cumulus">Cumulus</a> v<#version> (<#build>)
</p>
</div>
</body>
</html>
CSS:
@charset "UTF-8";
body {
background-color: white;
font-family: Arial;
font-size: 10pt;
color: black;
text-align: left;
background-attachment: fixed;
background-repeat: no-repeat;
background-position: left bottom;
table-layout: fixed;
}
#content {
margin-top: 5%;
margin-right: 20%;
margin-bottom: 5%;
margin-left: 20%;
width: 800px;
}
h1 {
font-size: 150%;
font-weight: bold;
color: black;
padding-bottom: 1em;
text-align: center;
}
h2 {
font-size: 10pt;
color: black;
font-family: Arial;
text-align: left;
}
a {
color: #000000;
text-decoration: underline;
font-weight: normal;
}
a:visited {
text-decoration: underline;
color: #000000;
}
a:hover {
text-decoration: underline;
color: #000000;
}
a:active {
text-decoration: underline;
color: #000000;
}
h1,h2,h3,h4,h5,h6 {
font-family: Arial;
}
.credits {
font-family: Arial;
font-size: 100%;
text-align: left;
}
h3 {
font-size: 110%;
font-weight: normal;
color: #585858;
letter-spacing: 0.4em;
text-transform: lowercase;
font-family: Arial, Helvetica, sans-serif;
text-align: left;
}
ul {
font-size: 75%;
padding-bottom: 1em;
padding-top: 1em;
margin-left: 10%;
list-style-type: square;
text-transform: lowercase;
}
li {
padding-bottom: 0.5em;
}
h2 {
font-family: Arial;
font-size: 100%;
font-weight: normal;
color: black;
padding-bottom: .2em;
background-color: white;
text-align: left;
padding-top: .2em;
padding-right: 1em;
}
.blockquote {
background-color: #E7E7DE;
margin-right: 22%;
}
caption {
font-size: 100%;
font-style: normal;
padding-top: 0.5em;
padding-bottom: 0.25em;
text-align: center;
}
table {
font-family: Arial;
}
.tableseparator_temp {
font-size: 100%;
font-weight: 400;
background-color: #6699CC;
color: black;
padding: .5em;
text-align: center;
}
.tableseparator_rainfall {
font-size: 100%;
font-weight: 400;
background-color: #6699CC;
color: black;
padding: .5em;
text-align: center;
}
.tableseparator_wind {
font-size: 100%;
font-weight: 400;
background-color: #6699CC;
color: black;
padding: .5em;
text-align: center;
}
.tableseparator_pressure {
font-size: 100%;
font-weight: 400;
background-color: #6699CC;
color: black;
padding: .5em;
text-align: center;
}
td {
font-size: 100%;
padding-top: 0.2em;
padding-bottom: 0.2em;
color: black;
}
.td_thumbnails {
padding-top: 0.1em;
padding-right: 0.2em;
padding-bottom: 0.1em;
padding-left: 0.0em;
}
.td_temperature_data {
background-color: white;
}
.td_rainfall_data {
background-color: white;
}
.td_wind_data {
background-color: white;
}
.td_pressure_data {
background-color: white;
}
.td_navigation_bar {
text-align: center;
padding-top: 1em;
padding-bottom: 1em;
background-color: #ffffff;
}
.labels {
background-position: left;
}
.site_data {
text-align: right;
}
.colon_separator {
font-weight: 400;
background-position: left;
}
Upvotes: 0
Views: 445
Answers (2)
davidcondrey
Reputation: 35983
Use the depreciated attribute rather than the CSS property and it will work.
td width=""
Upvotes: 1
SaggingRufus
Reputation: 1834
you may need to have a seperate CSS page and an IF statement at the top of the HTML that evaluates which web browser it is. Then, choose a different style sheet if it is IE 5 or 7
<!--[if IE]>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td colspan="3" class="tableseparator_temp">Temperature/Humidity</td>......
</tbody>
</table>
<![endif]-->
then we add the condition for if not right under that
<!--[if !IE]>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td colspan="3" class="tableseparator_temp">Temperature/Humidity</td>.........
</tbody>
</table
<![endif]-->
Upvotes: 0
Related Questions
- Table width in IE7/8
- Internet Explorer ignores width when use CSS table
- HTML table too wide in IE7
- IE doesn't recognize TD width?
- IE8 ignores td width, works on IE7
- Table width not working in only IE
- Table cell widths altering in IE
- Internet Explorer width issue
- what is the way to give fix width for table cells which works in IE
- IE doesn't respect td width