I'm currently just trying to make a layout for a webpage before I add any content. I've tested it in Opera and Firefox and it looks good, but with IE the layout is way off.

I'm quite new to CSS, so if anyone could help me as to what I'm doing wrong that would be awesome!

You can see the webpage here:

http://www.3vs3.tunerspec.ca/home.html

Thanks!

You'll need to change your layout.
-Make the content area a separate div.
-Float the left column left, give the #content div a wide enough left margin to push it over past the left column.
-Put a "wrapper" div around the whole thing, give it a width and use your css to center the whole thing (search here for the proper method for centering horizontally).

Use css for ALL of your formatting.
Replace <b></b> with <strong></strong>
Replace <i></i> with <em></em>
Get rid of that moldy old <center> tag and the "align="center"" junk, CSS should handle that.

Awesome! Thank you for the help!

It looks perfect in IE, Opera, and Firefox now.

I've done everything you said (I believe.) Could possibly take a quick look at the code again to make sure?

Pretty good. I forgot to mention one thing, sorry.
You have to CLEAR your floats:
http://css-discuss.incutio.com/?page=ClearingSpace

Awesome, thanks.

One more thing... if you look at www.3vs3.tunerspec.ca/rules.html

The files there are aligned using a table. I want the table to have a border of 1 pixel. I tried putting <table class="table"> in the table header, and then using my stylesheet to tell the table class to have a border of 1 pixel. It didn't work.

Could someone enlighten me as to why it didn't work, and how to get the table to have a border of 1 pixel using CSS?

table {border: 1px solid #000;}

Figured it out.

I was putting #table instead of .table in the stylesheet.

You didn't need either, just specify it the way I gave it to you, which simply addresses the table element alone.