Easy Fix, Help Greatly Appreciated

I really am clueless here guys, so anyone who can point me on the right path will be greatly appreciated. On my homepage, The Complete Soccer Guide, I created a custom template. It works fine, except that the middle column with the text falls down below on computer monitors that aren't small like mine.

Does anyone know the fix?

Here is the PHP:

/* HOME PAGE CUSTOM TEMPLATE */

function home_pagecustom() {
/* check to see if homepage. has to happen inside the function */
if (is_home() || is_front_page())  {
?>
<div id="sidebars">
<?php thesis_build_sidebars(); ?>
</div>
<div id="left">
<?php random_posts(); ?>
</div>
<div id="head">
<br /><h2>Dominate the Soccer Pitch</h2><br />
<p>The Complete Soccer Guide has all the information and videos you need to become a soccer player who is skilled in <b>Everything.</b>  This website provides:  </p><br />
<ul>
<li>Guides on every aspect of soccer</li>
<li>Easy to understand, step-by-step text.</li>
<li>Videos and pictures to increase understanding</li></ul><br />
<h3>All This Soccer Knowledge is Completely Free!</h3><br />
<p>So let's get started on your journey to soccer stardom.  Feel free to browse all the guides, go to the beginner or player pages, or view the featured guides below.</p><br />
<p>Above all, learn and love the game of soccer!</p><br />
<h3>Featured Guides</h3><br />
<h4>Soccer Skills and Techniques</h4><br />
<p>For an intermediate player, this should be the first section they check out.  Guides include:  <br />
<ul>
<li><a href="/soccer-shooting">Soccer Shooting</a>
</ul>  
</div>
</div>

<?php } }

/* Now we tell Thesis to use the home page custom template */

remove_action('thesis_hook_custom_template', 'thesis_custom_template_sample');
add_action('thesis_hook_custom_template', 'home_pagecustom');

Code (markup):

And the CSS:

#left {
float:left;
width:200px;
padding:10px;
}

#head {
width:1000px;
padding-right:10px;
}

#head h2 {font-face:Rockwell;font-size:30px;}
#head p {font-face:Arial; font-size:14px;}
#left li {list-style-position:inside;}
#left a {font-size: 12px;}
#head li {list-style-position:inside; font-size: 16px; font-face:Arial;}
#head h3 {color:#81C348;font-face:Arial; font-size:23px;}
#head h4 {font-face:Arial; font-size:15px; color: #A0A0A0;}
#head img {float:right; padding-left:8px;}
#wrap {
width:1000px;
margin:0 auto;
}

Thanks in advance!

 

It isn't even loading. Parse error. Escape your stuff

 

Make sure that your column widths (INCLUDING magrin, padding and borders) are less than your wrapper div width.
AND!!! Float all columns in the same direction. left, left, left. floating different directions is an easy way to screw up any layout.

 

Actually, I just realized it works in most browsers, just not IE. Does anyone know how to fix this? Perhaps some IE specific coding?

 

1) opening and closing php every other line is piss poor coding practice the moment you get logic flow involved. Use echo, it's cleaner. Lemme guess, turdpress?

2) You probably shouldn't be using line breaks to do padding or margin's job

3) you fail to close the P after the h4

4) you seem to close one more div than is actually open, but that's guessing since we arent' seeing the whole page.

Really we arent' seeing enough of your markup or CSS to offer any real advice, though I SUSPECT the problem could be you trying to put a 1000px element floated next to a 200px element inside a 1000px wrapping container. See a problem with that? OF COURSE it's riding down - that it isn't in non-IE browsers is one of the few specification bugs you'll find outside IE. Change #head to width:800px; and give it margin-right:-6px; - see what that does. 200px #left plus 800px #head should equal your 1000px wrap - the margin-right is a IE6 bugfix regarding perfect width floats, tricks 6 into thinking it's only 794px wide for it's float width.

Though honestly I wouldn't be setting a width on #head if it's supposed to be next to #left - I'd set margin-left:200px; and let the elements natural display:block behavior handle the rest. Then you don't even have to think about the math.

 

Haha, you know when I first started reading your posts you pissed me off, but you're actually starting to grow on me.

No prob now though. I decided to switch to two column, so I ditched the custom template. That was really my first attempt at php, and I knew it would be messy anyways. Thanks for the advice though.