Link to home
Start Free TrialLog in
Avatar of jasonbrandt3
jasonbrandt3

asked on

Archive and Footer <div> do not appear in IE8

Attached code works fine in firefox, everything displays as it should.  In IE the bottom two <div> sections, Archive and Footer do not appear.  Cannot figure out why!!  Any help appreciated.
<!DOCTYPE html>
<html>
<!--Site Design and Programming by Ketih Thomas-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=8,chrome=1">
 <script type="text/javascript">
    var mobile = (/iphone|ipad|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));  
    if (mobile) {  
        document.getElementById("#video").style.marginLeft = "50px";  
    }  
</script>

<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta name="keywords" content="Harrisburg University, Live, Video, HU, Stream">
<meta name="description" content="Harrisburg University Live Stream">
<title>Harrisburg University Live Stream</title>
<style type="text/css">
body {
	background-color: #AD985E;
	color: #362113;
	font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
	font-size: xx-large;
	text-align: center;
}
#Wrapper {
	height: 1500px;
	width: 1000px;
	margin: auto;
}
#Banner {
	height: 196px;
	width: 1000px;
	background-repeat: no-repeat;
	background-image: url('image/archive-banner.gif');
}
#Nav {
	height: 47px;
	width: 954px;
	background-repeat: no-repeat;
	background-image: url('image/Nav1.gif');
	margin: auto;
}
#Nav ul li a:hover {
	color: black;
}
#link1 {
	color: #FFFFFF;
	font-style: normal;
	text-decoration: none;
}
ul {
	font-size: 25px;
	text-align: left;
	line-height: normal;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	text-align: left;
	padding-top:5px
}
li {
	display: inline;
	padding-left: 30px;
}
#player {
	height: 584px;
	width: 1000px;
	background-repeat: no-repeat;
	background-image: url('image/Body-3.gif');
	margin-bottom: 20px;
}
#video {
	float:left;
	margin-left:20px;
	margin-top:40px;
	width: 960px;
	height: 500px;
	

}
#Archive {
	width: 1000px;
	height: 315px;
	background-repeat: no-repeat;
	background-image: url('image/archive2.gif');
	color: white;
	margin-bottom: 20px;
	font-size: 40px;
	text-decoration:underline;
}
#video1 {
	height: 219px;
	width:283px;
	margin-left:40px;
	margin-top:20px
}
#video2 {
	height:219px;
	width:283px;
	margin:20px
}
#Footer {
	width: 1000px;
	height: 261px;
	background-repeat: no-repeat;
	background-image: url('image/footer2.gif');
	font-size: 18px;
	padding-top: 30px;
}
</style>
<script type="text/javascript" src="javascript/jwplayer.js"></script>
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-26377505-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
</head>

<body>

<div id="Wrapper">
	<div id="Banner">
	</div>
	<div id="Nav">
		<ul>
			<li>
			<a id="link1" href="http://www.harrisburgu.edu/about/" target="_blank">
			About HU</a> </li>
			<li>
			<a id="link1" href="http://www.harrisburgu.edu/academics/" target="_blank">
			Degrees &amp; Programs</a></li>
			<li>
			<a id="link1" href="http://www.harrisburgu.edu/admissions/" target="_blank">
			Admissions</a></li>
			<li>
			<a id="link1" href="http://www.harrisburgu.edu/campuslife/" target="_blank">
			The Campus</a></li>
			<li>
			<a id="link1" href="http://www.harrisburgu.edu/news/" target="_blank">
			News &amp; Events</a></li>
		</ul>
	</div>
	<br>
	<div id="player">
	<div id="video">
	<script type="text/javascript">
	jwplayer("video").setup({
		flashplayer: "/player/player.swf",
		file: "/media/video1.mp4",
		image: "/image/poster1.jpg",
		height: 518,
		width: 900
		});
	</script>
			</div>
		</div>
        
		<div id="Archive">
		HU Live Stream Archive<br>
		<div id="video2" style="float:left">
			<a href="/video2.html">
		<img src="image/video2.gif" alt="video2" style="border-width:0px"></a>
		</div>
		<div id="video1" style="float:left">
			<a href="/video1.html">
		<img src="image/Video1now.gif" alt="video1" style="border-width:0px"></a>
		</div>
		</div>
	<div id="Footer">
		<p>Harrisburg University of Science and Technology.</p>
		<p>This player is designed for Adobie Flash. To return to the
		<br>Live Stream page, please follow the link below.</p>
		<p>To get Adobie Flash, click
		<a href="http://get.adobe.com/flashplayer/http://get.adobe.com/flashplayer/" target="_blank">here.</a></p>
		<a href="http://hulive.harrisburgu.edu/index.html">Back to HU Live</a>
	</div>
</div>
<br>

</body>

</html>

Open in new window

Avatar of rushtoshankar
rushtoshankar
Flag of United States of America image
Which version of IE do you use? I tried your code in IE9. It is working fine.
I tried, IE9, Firefox and Opera. All showed the page well.
Avatar of rushtoshankar
rushtoshankar
Flag of United States of America image
I have even tried IE6 in XP SP3 machine. It seems to be fine
Avatar of haloexpertsexchange
haloexpertsexchange
Flag of United States of America image
everything seems to display fine in ie 8 and in compatibility mode also.
The only problems that I had were since I did not have the videos and the JavaScript running the player I got errors but everything else was just fine.
Avatar of jasonbrandt3
jasonbrandt3

ASKER

I'm getting it in IE8, IE9 works fine.  Here is the link, it's accessible from the outside:

http://hulive.harrisburgu.edu

Thanks!
ASKER CERTIFIED SOLUTION
Avatar of haloexpertsexchange
haloexpertsexchange
Flag of United States of America image
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of jasonbrandt3
jasonbrandt3

ASKER

<!DOCTYPE html>
<html>
<!--Site Design and Programming by Ketih Thomas-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=8,chrome=1">
 <script type="text/javascript">
    var mobile = (/iphone|ipad|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));  
    if (mobile) {  
        document.getElementById("#video").style.marginLeft = "50px";  
    }  
</script>

<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta name="keywords" content="Harrisburg University, Live, Video, HU, Stream">
<meta name="description" content="Harrisburg University Live Stream">
<title>Harrisburg University Live Stream</title>
<style type="text/css">
body {
      background-color: #AD985E;
      color: #362113;
      font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
      font-size: xx-large;
      text-align: center;
}
#Wrapper {
      height: 1500px;
      width: 1000px;
      margin: auto;
}
#Banner {
      height: 196px;
      width: 1000px;
      background-repeat: no-repeat;
      background-image: url('image/archive-banner.gif');
}
#Nav {
      height: 47px;
      width: 954px;
      background-repeat: no-repeat;
      background-image: url('image/Nav1.gif');
      margin: auto;
}
#Nav ul li a:hover {
      color: black;
}
#link1 {
      color: #FFFFFF;
      font-style: normal;
      text-decoration: none;
}
ul {
      font-size: 25px;
      text-align: left;
      line-height: normal;
      list-style-type: none;
      margin: 0px;
      padding: 0px;
      text-align: left;
      padding-top:5px
}
li {
      display: inline;
      padding-left: 30px;
}
#player {
      height: 584px;
      width: 1000px;
      background-repeat: no-repeat;
      background-image: url('image/Body-3.gif');
      margin-bottom: 20px;
}
#video {
      float:left;
      margin-left:20px;
      margin-top:40px;
      width: 960px;
      height: 500px;
      

}
#Archive {
      width: 1000px;
      height: 315px;
      background-repeat: no-repeat;
      background-image: url('image/archive2.gif');
      color: white;
      margin-bottom: 20px;
      font-size: 40px;
      text-decoration:underline;
}
#video1 {
      height: 219px;
      width:283px;
      margin-left:40px;
      margin-top:20px
}
#video2 {
      height:219px;
      width:283px;
      margin:20px
}
#Footer {
      width: 1000px;
      height: 261px;
      background-repeat: no-repeat;
      background-image: url('image/footer2.gif');
      font-size: 18px;
      padding-top: 30px;
}
</style>
<script type="text/javascript" src="javascript/jwplayer.js"></script>
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-26377505-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
</head>

<body>

<div id="Wrapper">
      <div id="Banner">
      </div>
      <div id="Nav">
            <ul>
                  <li>
                  <a id="link1" href="http://www.harrisburgu.edu/about/" target="_blank">
                  About HU</a> </li>
                  <li>
                  <a id="link1" href="http://www.harrisburgu.edu/academics/" target="_blank">
                  Degrees &amp; Programs</a></li>
                  <li>
                  <a id="link1" href="http://www.harrisburgu.edu/admissions/" target="_blank">
                  Admissions</a></li>
                  <li>
                  <a id="link1" href="http://www.harrisburgu.edu/campuslife/" target="_blank">
                  The Campus</a></li>
                  <li>
                  <a id="link1" href="http://www.harrisburgu.edu/news/" target="_blank">
                  News &amp; Events</a></li>
            </ul>
      </div>
       <div id="player">
      <div id="video">
          </div>
            </div>  
      <br>
<div>
      <script type="text/javascript">
      jwplayer("video").setup({
            flashplayer: "/player/player.swf",
            file: "/media/video1.mp4",
            image: "/image/poster1.jpg",
            height: 518,
            width: 900
            });
      </script>
            
 </div>      
            <div id="Archive">
            HU Live Stream Archive<br>
            <div id="video2" style="float:left">
                  <a href="/video2.html">
            <img src="image/video2.gif" alt="video2" style="border-width:0px"></a>
            </div>
            <div id="video1" style="float:left">
                  <a href="/video1.html">
            <img src="image/Video1now.gif" alt="video1" style="border-width:0px"></a>
            </div>
            </div>
      <div id="Footer">
            <p>Harrisburg University of Science and Technology.</p>
            <p>This player is designed for Adobie Flash. To return to the
            <br>Live Stream page, please follow the link below.</p>
            <p>To get Adobie Flash, click
            <a href="http://get.adobe.com/flashplayer/http://get.adobe.com/flashplayer/" target="_blank">here.</a></p>
            <a href="http://hulive.harrisburgu.edu/index.html">Back to HU Live</a>
      </div>
</div>
<br>

</body>

</html>