No replies
chloe_hex
Offline
newbie
Last seen: 13 years 2 weeks ago
Joined: 2009-02-20
Posts: 5
Points: 0

Hi,

I am trying to make a column of descriptive text rest to the left and at the top of a page, next to an image. Right now my code works in Firefox, Safari, and Opera but not in IE 6 or 7. I would appreciate any tips on how to clean this up and make it work in IE!! Thanks!!

Here is my code:

<!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=UTF-8" />
<style type='text/css'>
#num {padding-left: 6px;}
.img-bot {margin-bottom: 6px; display: block; }
</style>
 
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link rel="stylesheet" type="text/css" href="css/js_style_new.css" />
	<script type="text/javascript" src="scripts/jquery-1.3.2.js"></script>
	<script type="text/javascript" src="scripts/javascript1.js"></script>
	<script type="text/javascript" src="scripts/javascript_jquery.js"></script>
    <script type="text/javascript" src="scripts/rollovers.js"></script>
<title>The Lovers Were Ambassadors To Imaginary Utopias</title>
 
<script type='text/javascript'>
$(document).ready(function() {
$('.pics').cycle({
	fx:'fade', 
	speed:'2000', 
	timeout: 0, 
	next:'#next', prev:'#prev'});
	});
</script>
</head>
<body>
<div id="container">
<div id="header">
<!--#include file="includes/header.shtml" -->
</div>
<div id="menu"> <!--#include file="includes/sidebar2.shtml" -->
  <!-- end #menu --></div>
<div id="mainContent">
<div id="description"><span class="imageFloatLeft"><h3>death in the garden of paradise</h3><p><em>Death in the Garden of Paradise </em>is an experimental documentary and travel essay shot in the Mughal Gardens of Lahore and the tombs of Makli in the Sindh Desert.  Using derelict urban landscapes and the imposing symmetry of Islamic architecture, the film constructs an eerie poem on loss and revisiting home. 
 <br /></p></span></div>
<div class="pics"> 
<div class="imageFloatLeft"><img src="images/dgp/dgp_still.jpg" width="600" height="408" />
<p>Death in the Garden of Paradise, 22min, 16 mm and DV, 2004</p></div>
<!-- end .pics --></div>
<!-- end #mainContent --></div>
<!-- end #container --></div>
</body>
</html>

*CSS

.imageFloatLeft {
 
float:left; 
margin-top: 21px;
 
}