Forums

brianatlarge

Website:

http://www.studentseatfree.com/specials.php

In firefox, I can mouse over the listings and click on them, but in IE, it doesn't work.

Does IE support onmouseover and onclick in the table tag? Cause that's what I have going on right now.

HTML:

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

	<head>
		<title>Students Eat Free - Special Deals</title>
		<meta http-equiv=\"Content-type\" content=\"text/html; charset=UTF-8\">
		<link rel=StyleSheet href=\"main_style.css\" type=\"text/css\">
	</head>
	<body>
	<div class=\"back1\"> 
		<div class=\"back2\">

	<div class=\"everything\">
		
	<div class=\"searchbox\"></div>
	
	<div class=\"searchformbox\">
		<div class=\"nav-area\">
				<a href=\"/search.php\">Coupons</a> | 
				<a href=\"/index.php\">Specials</a> | 
				<a href=\"/advertise/\">Advertise</a>

		</div>
		
	<div class=\"login-area\">
				<a href=\"\">Login</a> | 
				<a href=\"\">Get Free Food!</a>
		</div>
	</div>
	
	<div class=\"logobox\"><a href=\"index.php\"><img src=\"images/newlogo.jpg\" alt=\"logo\"></a></div>
	<div class=\"adtopbox\"><a href=\"http://www.studentseatfree.com/advertise/\"><img src=\"http://www.studentseatfree.com/images/ads/sefbanner.jpg\" alt=\"bannerad\"></a></div><div style=\"clear:both\">

	<div class=\"refine\">
		<form class=\"sortareambox\" action=\"specials.php\" method=GET>
			<div class=\"sort-area\">
				Sort by: <select name=\"sort_type\">
					<option value=restaurant_name selected>Restaurant Name
					<option value=restaurant_type>Restaurant Type
					<option value=discount_type>Discount Type
				</select>
				<input type=submit value=\"Sort\">
			</div>

			<div class=\"search-area\">
				<input type=text name=search_query value=\"\">
				<input type=submit value=\"Search\">
			</div>	
		</form>
	</div>
	<div style=\"clear:both\"></div>
	<div class=\"adbox\"><a href=\"http://www.studentseatfree.com/advertise/\"><img src=\"http://www.studentseatfree.com/images/ads/sefmedium.jpg\" alt=\"boxad\"></a></div>
	<div class=\"skyscraper\"><a href=\"http://www.studentseatfree.com/advertise/\"><img src=\"http://www.studentseatfree.com/images/ads/sefskyscraper.jpg\" alt=\"skyscraperad\"></a></div>

	<div class=\"results\">
	&lt;&nbsp;1 &gt;	
	&nbsp;<a href=specials.php>All Listings</a><br>
	</div>
	
	
	
	<br>
	<table class=\"contentbox\" border=0 style=\"background-color:#daf2c8\" cellspacing=\"5\" onmouseover=\"this.style.backgroundColor='#fee393'; this.style.cursor='pointer';\" onClick=\"window.open('http://www.studentseatfree.com/coupon.php?3','mywindow','location=no,menubar=no,directories=no,titlebar=no,toolbar=no,resizable=no,scrollbars=no,width=500,height=450')\"  onmouseout=\"this.style.backgroundColor='#daf2c8'\">
			<tr>
				<td width=\"100px\" rowspan=\"2\"><img src=\"http://www.studentseatfree.com/images/logos/wendys.jpg\" alt=\"\"></td>

				<td class=\"restname\" colspan=3 width=\"360px\">Dagum Crepes</td>
				<td><a target=\"_new\" href=\"http://maps.google.com/maps?f=q&amp;hl=en&amp;q=Dagum+Crepes%2C+4000+Sharon+Rd.%2C+Charlotte%2C+NC+28210&amp;ie=UTF8&amp;iwloc=addr\"><img src=\"images/viewmap.jpg\" alt=\"view map\"></a></td>
			</tr>
			<tr>
				<td class=\"description\" width=\"300px\">10% off any purchase with student ID</td>
			</tr>
		</table>
	<br>

	<table class=\"contentbox\" border=0 style=\"background-color:#f2fef2\" cellspacing=\"5\" onmouseover=\"this.style.backgroundColor='#fee393'; this.style.cursor='pointer';\" onClick=\"window.open('http://www.studentseatfree.com/coupon.php?1','mywindow','location=no,menubar=no,directories=no,titlebar=no,toolbar=no,resizable=no,scrollbars=no,width=500,height=450')\"  onmouseout=\"this.style.backgroundColor='#f2fef2'\">
			<tr>
				<td width=\"100px\" rowspan=\"2\"><img src=\"http://www.studentseatfree.com/images/logos/wendys.jpg\" alt=\"\"></td>
				<td class=\"restname\" colspan=3 width=\"360px\">Boysenberry Hullabaloo</td>
				<td><a target=\"_new\" href=\"http://maps.google.com/maps?f=q&amp;hl=en&amp;q=Boysenberry+Hullabaloo%2C+123+Meow+Yes+Way%2C+Charlotte%2C+NC+28210&amp;ie=UTF8&amp;iwloc=addr\"><img src=\"images/viewmap.jpg\" alt=\"view map\"></a></td>
			</tr>
			<tr>
				<td class=\"description\" width=\"300px\">$5 off any order $25 or more</td>

			</tr>
		</table>
		
	
	<div class=\"clear\"></div>

	<div id=\"footer\">
		<span id=\"footer_text\">
			&copy; Copyright 2008 StuckPixel Studio LLC &amp; Jaree Marketing LLC<br>

			All Rights Reserved<br>
			Hattiesburg, MS
		</span>
		<div style=\"float: right;\">
			<p>
    			<a href=\"http://validator.w3.org/check?uri=referer\"><img
        		src=\"http://www.w3.org/Icons/valid-html401\"
        		alt=\"Valid HTML 4.01 Transitional\" height=\"31\" width=\"88\"></a>
  				</p>
		</div>
	</div>

	</div>
	</div>
	</div>
	</div>
	<script type=\"text/javascript\">
var gaJsHost = ((\"https:\" == document.location.protocol) ? \"https://ssl.\" : \"http://www.\");
document.write(unescape(\"%3Cscript src='\" + gaJsHost + \"google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E\"));
</script>
<script type=\"text/javascript\">
var pageTracker = _gat._getTracker(\"UA-5202505-1\");
pageTracker._trackPageview();
</script>
	</body>
</html>

CSS:

* { margin: 0; padding: 0; }

img, div { behavior: url(iepngfix.htc) }

body
{
font-family: Helvetica, Arial, Verdana, sans-serif;
font-size:12px;
background:#ffffff;
}

.back1
{
background:url(images/back1.jpg);
background-position: left top;
background-repeat:no-repeat;
}

.back2
{
background:url(images/back2.jpg);
background-position: right bottom;
background-repeat:no-repeat;
}

.searchbox
{
background:url(images/topgreen.png);
background-repeat:no-repeat;
margin:0px auto;
height:30px;
width:999px;
}

.everything
{
background:url(images/bg.png);
background-position: center top;
background-repeat:repeat-y;
margin:0px auto;
width:999px;
display:block;

}

.villiesflyer
{
background:url(images/villiesflyer.jpg);
background-repeat:no-repeat;
margin:0px auto;
height:1241px;
min-height:1241px;
width:959px;
}


.searchformbox
{
margin-top:-27px;
margin-left:30px;
}

.searchformbox a
{
color: #334400;
text-decoration: none;
}

.searchformbox a:hover
{
color: #492e00;
text-decoration:underline;
}


.nav-area 
{
float:left;
width:300px;
display:inline;
margin-top: 5px;
font-size:16px;
}

.login-area 
{
float:right;
width:195px;
display:inline;
margin-top: 5px;
font-size:16px;
text-decoration: none;
}

.sort-area 
{
width:300px;
margin-left: 10px;
float:left;
display:inline;
}

.sort-areabox
{
margin-top:-27px;
margin-left:30px;
display:inline;
}

.search-area 
{
float:right;
width:220px;
display:inline;
}

.logobox
{
width:175px;
min-height:135px;
height:135px;
margin-left:30px;
margin-right:10px;
margin-top:29px;
float:left;
display:inline;
clear:both;
}

.adtopbox
{
background-repeat:no-repeat;
width:730px;
min-height:90px;
height:90px;
margin-left:200px;
margin-top:-114px;
padding-right:65px;
float:right;
display:inline;
}


.adbox
{
width:300px;
min-height:250px;
height:250px;
float:right;
margin-right:70px;
margin-top:25px;
/*display:inline;*/
}


.skyscraper
{
clear: both;
float:right;
/*margin-right:-225px;*//*position:relative;zoom: 1;*/
/*display:inline;*/
width:160px;
margin: 20px 140px 0 0;
min-height:600px;
height:600px;
/*margin-top:294px;*/
}


* html .adbox, * html .skyscraper {display:inline;}


.contentbox
{
width:560px;
min-height:100px;
padding: 5px;
background-position: left top;
margin-left:30px;
}

.comingsoon
{
background:url(images/comingsoon.jpg);
background-repeat:no-repeat;
margin:0px auto;
height:600px;
width:960px;
}


.description
{font-size:16px;
}

.results 
{
margin-left:30px;
}

.resultspadding 
{
padding:5px;
}

.restname
{
font-family: Helvetica, Arial, Verdana, sans-serif;
font-size:20px;
font-weight:bold;
}

.floatleft {
float: left;
margin: 0px 10px 10px 0px;
}

.refine
{
background-color:#eeeeee;
min-height:30px;
height:30px;
width:900px;
margin-left:30px;
padding-top:5px;
background-position: center top;

}

/*Footer*/

#footer {
padding:10px 0px 70px 10px;
color:#0c0c0c;
width:951px;
background-color:#daf2c8;
font-size:9px;
text-align: left;
line-height:12px;
margin:35px auto 0px;
}

#footer img {
float:left;
margin-right:10px;
}

#footer span {
display:block;
float:left;
width:300px;
}

#footer a {
color:#9e8292;
text-decoration:none;
}

/*end footer*/

img {border:none}

div.clear { clear: both; }

.boxlink
{
color:#000000;
text-decoration:none;
}

/*advertise page*/

h1.adheader {color:#446a31; line-height: 30px;}
h1.advertise {color:#446a31; font-size:70px; font-weight:bold; margin-top:60px;}

.adintro
{
font-size:14px;
width:450px;
margin-left: 30px;
padding-top: 20px;
line-height:20px;
float:left;
display:inline;
}

.errormessage
{
font-size:14px;
width:450px;
margin-left: 220px;
padding-top: 20px;
padding-bottom: 100px;
line-height:20px;
float:left;
display:inline;
}

.adpoints
{
font-size:14px;
width:450px;
margin-top:25px;
padding-top: 20px;
margin-right:25px;
line-height:20px;
float:right;
display:inline;
}

.adsizes
{
width:450px;
height:369px;
min-height:369px;
margin-right:40px;
float:right;
display:inline;
}

#form1 {width:640px;}

.contact_form
{
margin:0px auto;
width:640px;
padding:15px;
}

/*advertise page over*/



/*navigation*/

.cssnav
{
position: relative;
font-family:  helvetica, arial, sans-serif;
background: url(images/buttonoff.jpg) no-repeat;
white-space: nowrap;
display: inline;
width: 144px;
height: 35px;

}

.cssnav a
{
display: inline;
color: black;
font-size: 18px;
font-weight:bold;
width: 144px;
height: 35px;
color: black;
text-decoration: none;

}

.cssnav img
{
width: 144px;
height: 35px;
border: 0

}

* html a:hover
{
visibility:visible
}

.cssnav a:hover img
{
visibility:hidden
}

.cssnav span
{
position: absolute;
left: 0px;
width:144px;
height:35px;
color: black;
cursor: pointer;
text-align:center;
vertical-align:middle;
line-height: 35px;
} 
/* navigation over */

Thanks!

brianatlarge

YES!!! I FIXED IT! OH DUDE!!!

So IE only supports rollover stuff in <a> tags, so I just enclosed the table in <a></a> and it fixed it.

Thanks everyone! I think the site is done.

treehouse : what would you like to learn today?

Forums

onmouseover for tables in ie?