• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 219
  • Last Modified:

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

0
jasonbrandt3
Asked:
jasonbrandt3
  • 3
  • 2
  • 2
1 Solution
 
rushtoshankarCommented:
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.
0
 
rushtoshankarCommented:
I have even tried IE6 in XP SP3 machine. It seems to be fine
0
 
haloexpertsexchangeCommented:
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.
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

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

http://hulive.harrisburgu.edu

Thanks!
0
 
jasonbrandt3Author Commented:
Sorry, I posted wrong link:

http://hulive.harrisburgu.edu/video1.html

0
 
haloexpertsexchangeCommented:
I got this error when I went to the page in ie

Message: HTML Parsing Error: Unable to modify the parent container element before the child element is closed (KB927917)
Line: 0
Char: 0
Code: 0
URI: http://hulive.harrisburgu.edu/video1.html

0
 
jasonbrandt3Author Commented:
<!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>
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 3
  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now