Solved

background color in ie

Posted on 2012-03-14
6
430 Views
Last Modified: 2012-03-14
Hi
i have this style
#td1{
      border:1px solid #000;
        background-color:#fff;
        font-size:90%;
         
}      
echo"<td id='td1'>$unit<b> has not reported in for</b> :$days $day</td>";

in firefox it works perfect but in ie it shows a black banner
it is like this style not working in IE
ANY help please
0
Comment
Question by:asaidi
  • 2
  • 2
  • 2
6 Comments
 
LVL 22

Expert Comment

by:Kim Walker
ID: 37719646
Do you have any other elements with the same id (td1)? Can you post the full page? We need to see if anything else is interfering or if the cascade is being applied differently in IE.
0
 
LVL 12

Expert Comment

by:Tony van Schaik
ID: 37719649
I can't see any issues with your code it works in all IE versions the same. Do you have the full HTML source code of your page so that i can view it?
0
 

Author Comment

by:asaidi
ID: 37720289
Hi
please find attached page source from browser
  </body>
</html>    
      
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1252' />
<title>CAMPION The Power Behind The Water</title>
<style type="text/css"  >
#fixed {
    position: absolute;
    top: 0;
    left: 0;
    width: 10em;
    height: 100%;
}
@media print {
input#btnPrint {
display: none;
}
}    
@media screen{
    .imgs1 {
       position:absolute;
       width:30%;
       height:15%;
       top:-6px;
       left:0;
      }
  } 
#table2 {
     
 border:1px ;
      border-collapse:collapse;
      font-family:arial,sans-serif;
      font-size:90%;
        width:100%;      
        height:100%;
       background-color:#9de;

}

#tab{
       position:relative;
        top:-90px;  
        left: 580px;
	border=0;
	background-color:#FFF;
        font-size:70%;
        border:0px ;
}
#table4{
        border:3px solid #fff;
        position:relative;
        top:-5px;  
        
}
table {
	border:1px solid #000;
	border-collapse:collapse;
	font-size:70%;
}
#td1{
	border:1px solid #000; 
        background-color:#fff;
        font-size:90%;
         
}	
#td11{
	 
        background-color:#fff;
}

#td3{
        position:relative;
        top:1450px;
        border:0  ;
	border-collapse:collapse;
	padding:5px; 
        background-color:#fff;
}

#td2{
	 background-color: rgb(255,255,0); /* Needed for IEs */

        -moz-box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
        -webkit-box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
        box-shadow: 5px 5px 5px rgba(68,68,68,0.6);

	
}	

td,th{
	 
	border-collapse:collapse;
	padding:5px;
         
}	
#fn,#dp,#ar{width:110px;font-weight:normal;}
#fr,#to{width:90px;font-weight:normal; }
caption{
	background:#ccc;
	font-size:100%;
	border:1px solid #000;
	border-bottom:none;
	padding:20px 0 0 0;
	text-align:left;
}
thead th{
	background-color:#9cf;
	text-align:left;
}
tbody th{
	text-align:left;
	background:#69c;
}
 

tfoot td{
	text-align:left;
	font-weight:bold;
	background:#08ABF6;
          
}

tbody td{
	background:#fff;	
        
}
tbody tr.odd td{
	background:#ccc;
        
}
div.ex
{
top:-40px;
width:220px;
padding:10px;
border:5px solid gray;
margin:0px;
} 
</style>
<script language='JavaScript'>
DA = (document.all) ? 1 : 0
 
function HandleError()
{
alert('\nNothing was printed. \n\nIf you do want to print this page, then\nclick on the printer icon in the toolbar above.')
return true;
}
</script>
</head>  
<body>
<img src="campion.png" alt="Campion the power in the water"></img>    
<!-- The outter table to contain the form and the instruction panel -->

<h2>Welcome Screen</h2>  

<table id='table2'><summary="Welcome screen.">
  <thead>

<tr>
      <td> Welcome : <b>PatTreacy</b> </td>
       
      <td>Last Login : <b>14-03-2012</b></td><td>No of logs:<b>112</b></td> </tr>

<tr> 
      <td>User Type : <b>Account Customer</b></td>  
      <td>User Status : <b>Suspended</b></td> </tr> 
<tr>  <td>Valid Until : <b>12-12-2031</b></td></tr>  
 

<tr><td>User Message </td></tr>
<tr><td><TEXTAREA name="data" ROWS=3 COLS=30 readonly="yes">Test Message For Pat</TEXTAREA></td></tr>
    

<th>System</th>
<tr>
      <td>No of systems :<b>1</b></td>   
      <td>No of Meters :<b>18</b></td> </tr>
<tr>
     
      <td>No of Accounts :<b>1</b></td> </tr>  

<tr>  <td>No of Customers :<b>1</b></td> </tr>      
  
<hr>
<th>System Overview</th>

<tr><td>Water Recorded Yesterday:==><b></b> </td></tr>
 
<tr><td>This Week:==><b>1817510</b> </td></tr>

<tr><td>This Month :==><b>1817510</b></td></tr>  
<tr><td bgcolor='#69c'><b> Any Issues</b></td></tr>
 <h4 align="center">Any Issues</h4> 
<td><select name=student size='4'>Any Issues </option><option><b>Knockadeen Lane Freneystown Bulk 2</b> has not reported in for :<b>1</b> day</option><option><b>Barnafae Line Bulk 3</b> has not reported in for :<b>11</b> days</option><option><b>Break Tank</b> has not reported in for :<b>1</b> day</option><option><b>Castlewarren Bulk 5 On Main Line</b> has not reported in for :<b>13</b> days</option><option><b>Ossory Hill Bulk 2</b> has not reported in for :<b>10</b> days</option><option><b>Freneystown Bulk 2</b> has not reported in for :<b>23</b> days</option><option><b>Flagmount Bulk 3</b> has not reported in for :<b>29</b> days</option><option><b>Reevanagh Bulk Meter</b> has not reported in for :<b>23</b> days</option><option><b>Garthhill Freneystown</b> has not reported in for :<b>23</b> days</option><option><b>Reservoir Unit 1</b> has not reported in for :<b>19</b> days</option><option><b>Bulk Meter Upper Coolgreaney</b> has not reported in for :<b>23</b> days</option><option><b>Knockadeen Bulk 6 on Main Line</b> has not reported in for :<b>4</b> days</option><option><b>Castlewarren Bulk 4 on Main Line</b> has not reported in for :<b>23</b> days</option><option><b>Castlewarren Bulk 3 on Main Line</b> has not reported in for :<b>1</b> day</option><option><b>Barnafae Line Bulk 2</b> has not reported in for :<b>1</b> day</option><option><b>Coolmarks Bulk 2 On Main Line</b> has not reported in for :<b>1</b> day</option><option><b>Reservoir Unit 2</b> has not reported in for :<b>1</b> day</option></select></td>  

<tr><td>Alarms detected this Month :</td></tr>

 
  </thead>

 
 </table> 
<input type="button" id="btnPrint"onclick="window.location.href='menu.php?auto_id=1'" value='Enter'disabled = "disabled">
<input type="button" id="btnPrint"onclick="window.location.href='loging.php?>'" value='Exit'>

Open in new window

0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 22

Expert Comment

by:Kim Walker
ID: 37720397
This is incomplete. It doesn't include the td you're asking about.
0
 

Author Comment

by:asaidi
ID: 37720467
Hi
check the internet one maybe in my localhost i have changed a bit of my code
  </body>
</html>    
      
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1252' />
<title>CAMPION The Power Behind The Water</title>
<style type="text/css"  >
#fixed {
    position: absolute;
    top: 0;
    left: 0;
    width: 10em;
    height: 100%;
}
@media print {
input#btnPrint {
display: none;
}
}    
@media screen{
    .imgs1 {
       position:absolute;
       width:30%;
       height:15%;
       top:-6px;
       left:0;
      }
  } 
#table2 {
     
 border:1px ;
      border-collapse:collapse;
      font-family:arial,sans-serif;
      font-size:90%;
        width:100%;      
        height:100%;
       background-color:#9de;

}

#tab{
       position:relative;
        top:-90px;  
        left: 580px;
	border=0;
	background-color:#FFF;
        font-size:70%;
        border:0px ;
}
#table4{
        border:3px solid #fff;
        position:relative;
        top:-5px;  
        
}
table {
	border:1px solid #000;
	border-collapse:collapse;
	font-size:70%;
}
#td1{
	border:1px solid #000; 
        background-color:#fff;
        font-size:90%;
         
}	
#td11{
	 
        background-color:#fff;
}

#td3{
        position:relative;
        top:1450px;
        border:0  ;
	border-collapse:collapse;
	padding:5px; 
        background-color:#fff;
}

#td2{
	 background-color: rgb(255,255,0); /* Needed for IEs */

        -moz-box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
        -webkit-box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
        box-shadow: 5px 5px 5px rgba(68,68,68,0.6);

	
}	

td,th{
	 
	border-collapse:collapse;
	padding:5px;
         
}	
#fn,#dp,#ar{width:110px;font-weight:normal;}
#fr,#to{width:90px;font-weight:normal; }
caption{
	background:#ccc;
	font-size:100%;
	border:1px solid #000;
	border-bottom:none;
	padding:20px 0 0 0;
	text-align:left;
}
thead th{
	background-color:#9cf;
	text-align:left;
}
tbody th{
	text-align:left;
	background:#69c;
}
 

tfoot td{
	text-align:left;
	font-weight:bold;
	background:#08ABF6;
          
}

tbody td{
	background:#fff;	
        
}
tbody tr.odd td{
	background:#ccc;
        
}
div.ex
{
top:-40px;
width:220px;
padding:10px;
border:5px solid gray;
margin:0px;
} 
</style>
<script language='JavaScript'>
DA = (document.all) ? 1 : 0
 
function HandleError()
{
alert('\nNothing was printed. \n\nIf you do want to print this page, then\nclick on the printer icon in the toolbar above.')
return true;
}
</script>
</head>  
<body>
<img src="campion.png" alt="Campion the power in the water"></img>    
<!-- The outter table to contain the form and the instruction panel -->

<h2>Welcome Screen</h2>  

<table id='table2'><summary="Welcome screen.">
  <thead>

<tr>
      <td> Welcome : <b>PatTreacy</b> </td>
       
      <td>Last Login : <b>14-03-2012</b></td><td>No of logs:<b>17</b></td> </tr>

<tr> 
      <td>User Type : <b>Account Customer</b></td>  
      <td>User Status : <b>Normal</b></td> </tr> 
<tr>  <td>Valid Until : <b>12-12-2031</b></td></tr>  
 

<tr><td>User Message </td></tr>
<tr><td><TEXTAREA name="data" ROWS=3 COLS=30 readonly="yes">Test Message For Pat</TEXTAREA></td></tr>
    

<th>System</th>
<tr>
      <td>No of systems :<b>1</b></td>   
      <td>No of Meters :<b>18</b></td> </tr>
<tr>
     
      <td>No of Accounts :<b>1</b></td> </tr>  

<tr>  <td>No of Customers :<b>1</b></td> </tr>      
  
<hr>
<th>System Overview</th>

<tr><td>Water Recorded Yesterday:==><b>908770</b> </td></tr>
 
<tr><td>This Week:==><b>3771310</b> </td></tr>

<tr><td>This Month :==><b>11867670</b></td></tr>  
<tr><td bgcolor='#69c'><b> Any Issues</b></td></tr>
 
<td id='td1'>Barnafae Line Bulk 3<b> has not reported in for</b> :6 days</td><td id='td1'>Bulk Meter Upper Coolgreaney<b> has not reported in for</b> :7 days</td></tr><tr><td id='td1'>Knockadeen Bulk 6 on Main Line<b> has not reported in for</b> :7 days</td><td id='td1'>Barnafae Line Bulk 2<b> has not reported in for</b> :6 days</td>  

<tr><td>Alarms detected this Month :</td></tr>

 
  </thead>

 
 </table> 
<input type="button" id="btnPrint"onclick="window.location.href='menu.php?auto_id=1'" value='Enter'>
<input type="button" id="btnPrint"onclick="window.location.href='loging.php?>'" value='Exit'>

Open in new window

0
 
LVL 12

Accepted Solution

by:
Tony van Schaik earned 500 total points
ID: 37722401
It seems that IE doesn't like your short hex code if i change that it works like it should:

<td bgcolor='#69c'>

Change that to:
<td bgcolor='#6699cc'>

Open in new window


And 1 other thing your code doesn't seem to be valid i get a lot of errors in Dreamweaver, unclosed HTML and so on, this can also be an issue, especially when you want to have this working cross-browser.

Also note that you use a XHTML doctype and you also use HTML4 code in it, like the <b> tag, use <strong> instead. Validate your HTML http://validator.w3.org/

You are also using multi #td1, use an ID once on an element, use class if you want to add it on multiple elements, otherwise this will cause issues in several browsers. Same goes for you input buttons both have the same ID Btnprint, add a .class instead use that ID only once, it can happen that things get submitted twice.

Here is your HTML but valid:

<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=iso-8859-1' />
<title>CAMPION The Power Behind The Water</title>
<style type="text/css"  >
#fixed {
	position: absolute;
	top: 0;
	left: 0;
	width: 10em;
	height: 100%;
}
@media print {
input#btnPrint {
	display: none;
}
}
@media screen {
.imgs1 {
	position:absolute;
	width:30%;
	height:15%;
	top:-6px;
	left:0;
}
}
#table2 {
	border:1px;
	border-collapse:collapse;
	font-family:arial, sans-serif;
	font-size:90%;
	width:100%;
	height:100%;
	background-color:#9de;
}
#tab {
	position:relative;
	top:-90px;
	left: 580px;
 border=0;
	background-color:#FFF;
	font-size:70%;
	border:0px;
}
#table4 {
	border:3px solid #fff;
	position:relative;
	top:-5px;
}
table {
	border:1px solid #000;
	border-collapse:collapse;
	font-size:70%;
}
.td1 {
	border:1px solid #000;
	font-size:90%;
}
#td11 {
	background-color:#fff;
}
#td3 {
	position:relative;
	top:1450px;
	border:0;
	border-collapse:collapse;
	padding:5px;
	background-color:#fff;
}
#td2 {
	background-color: rgb(255,255,0); /* Needed for IEs */
	-moz-box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
	-webkit-box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
	box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
}
td, th {
	border-collapse:collapse;
	padding:5px;
}
#fn, #dp, #ar {
	width:110px;
	font-weight:normal;
}
#fr, #to {
	width:90px;
	font-weight:normal;
}
caption {
	background:#ccc;
	font-size:100%;
	border:1px solid #000;
	border-bottom:none;
	padding:20px 0 0 0;
	text-align:left;
}
thead th {
	background-color:#9cf;
	text-align:left;
}
tbody th {
	text-align:left;
	background:#69c;
}
tfoot td {
	text-align:left;
	font-weight:bold;
	background:#08ABF6;
}
tbody td {
}
tbody tr.odd td {
	background:#ccc;
}
div.ex {
	top:-40px;
	width:220px;
	padding:10px;
	border:5px solid gray;
	margin:0px;
}
strong {
	font-weight:bold;
}
</style>
<script language='JavaScript' type="text/javascript">
DA = (document.all) ? 1 : 0
 
function HandleError()
{
alert('\nNothing was printed. \n\nIf you do want to print this page, then\nclick on the printer icon in the toolbar above.')
return true;
}
</script>
</head>
<body>
<img src="campion.png" alt="Campion the power in the water" /> 
<!-- The outter table to contain the form and the instruction panel -->

<h2>Welcome Screen</h2>
<table id='table2' summary="Welcome Screen">
  <thead>
    <tr>
      <td> Welcome : <strong>PatTreacy</strong></td>
      <td>Last Login : <strong>14-03-2012</strong></td>
      <td>No of logs:<strong>17</strong></td>
    </tr>
    <tr>
      <td>User Type : <strong>Account Customer</strong></td>
      <td>User Status : <strong>Normal</strong></td>
    </tr>
    <tr>
      <td>Valid Until : <strong>12-12-2031</strong></td>
    </tr>
    <tr>
      <td>User Message </td>
    </tr>
    <tr>
      <td><textarea name="data" rows="3" cols="30" readonly="readonly">Test Message For Pat</textarea></td>
    </tr>
  </thead>
  <tr>
    <th>System</th>
  </tr>
  <tr>
    <td>No of systems :<strong>1</strong></td>
    <td>No of Meters :<strong>18</strong></td>
  </tr>
  <tr>
    <td>No of Accounts :<strong>1</strong></td>
  </tr>
  <tr>
    <td>No of Customers :<strong>1</strong></td>
  </tr>
  <tr>
    <td><hr /></td>
  </tr>
  <tr>
    <th>System Overview</th>
  </tr>
  <tr>
    <td>Water Recorded Yesterday:==&gt;<strong>908770</strong></td>
  </tr>
  <tr>
    <td>This Week:==&gt;<strong>3771310</strong></td>
  </tr>
  <tr>
    <td>This Month :==&gt;<strong>11867670</strong></td>
  </tr>
  <tr>
    <td bgcolor='#6699cc'><strong> Any Issues</strong></td>
  </tr>
  <tr>
    <td class='td1'>Barnafae Line Bulk 3<strong> has not reported in for</strong> :6 days</td>
    <td class='td1'>Bulk Meter Upper Coolgreaney<strong> has not reported in for</strong> :7 days</td>
  </tr>
  <tr>
    <td class='td1'>Knockadeen Bulk 6 on Main Line<strong> has not reported in for</strong> :7 days</td>
    <td class='td1'>Barnafae Line Bulk 2<strong> has not reported in for</strong> :6 days</td>
  </tr>
  <tr>
    <td>Alarms detected this Month :</td>
  </tr>
  <tr>
    <td></td>
  </tr>
</table>
<input type="button" id="btnPrint1" onclick="window.location.href='menu.php?auto_id=1'" value='Enter' />
<input type="button" id="btnPrint2" onclick="window.location.href='loging.php?&gt;'" value='Exit' />
</body>
</html>

Open in new window


Good luck
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

932 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now