Jump to content

Div Alignment Problem in IE not Firefox


kts

Recommended Posts

The alignment for the content is pushed down too far on IE, but fine on Firefox. I am very new to css so I'm not sure why.

 

creativehypnosis.biz/index.php is the site

 

here is the code

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <meta name="description" content="Creative Hypnosis and Educational Therapies" />
  <meta name="keywords" content="hypnosis therapy, iet, eft, health, mental health, relaxation, therapy" />
  <meta name="author" content="Kyle Shannon" />
  <link rel="stylesheet" type="text/css" href="stylesheet.css" media="screen,projection" />
  <title>Creative Hypnosis and Energy Therapies</title>
  <style type="text/css">
<!--
.style1 {color: #0099CC}
.style2 {color: #00CCCC}
.style3 {color: ##0099CC}
-->
  </style>
</head>

<body>
<div id="wrap">
  <div id="header">
	<h1><a href="#" class="style1"><span class="large">Creative Hypnosis and Energy Therapies</span> </a></h1>
    <p> </p>
  </div>

<div id="leftside">
	<h2 class="">Menu </h2>
	<ul class="avmenu">
		<li><a href="index.php">Home</a></li>
		<li><a href="index.php?page=3">Training/Workshops</a></li>
		<li><a href="index.php?page=4">Calendar of Events</a></li>
		<li><a href="index.php?page=5">Links</a></li>
		<li><a href="contact.php">Contact</a></li>
		<li></li>
	</ul>
</div>
<br />
<br /><br />

<div id="leftside">
	<h2 class="">What is? </h2>
	<ul class="avmenu">
		<li><a href="index.php?page=6">Hypnosis</a></li>
		<li><a href="index.php?page=7">Reiki</a></li>
		<li><a href="index.php?page=8">IET</a></li>
		<li><a href="index.php?page=9">EFT</a></li>
		<li></li>
	</ul>
</div>

    <div id="contentwide" valign="top">
	<h2 align="center"><span class="highlighted"><?php echo $pageTitle; ?></span></h2>
	<p align="center"> </p>
	<p><?php echo $pageInfo; ?></p>
    </div>

<div id="footer">
	<p> </p>
</div>

</div>
</body>
</html>

Link to comment
Share on other sites

merge both panels from the left side so they are inside the first <div id="leftside"> (p.s. - if you use ID, you can only have one element with it)

 

after you only have one "leftside" element, if it is still doing it, remove the clear:left attribute from it

Link to comment
Share on other sites

OK, if you're looking to move it down from the view in FF(personally the position I think looks much better), modify stylesheet.css to

 

#contentwide {position:relative; top:30px;line-height:1.5em;...

 

It moves the entire column down 30px in FF, but not in safari or IE. So that should have you set.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.