View Full Version : Proper CSS format for IE + Other browsers (IE compatibility)

10-06-2007, 12:17 AM
Ok, so I'm having some problems getting my site to look how I want. The formatting appears correctly in all browsers (I think) but in IE it's horribly messed up. This is my first site that I'm making just to learn some things and I don't know much CSS at all. I've tried reading up but am not sure how to properly use CSS to make this work cross browser capable. Basically, I want my text box search bar properly centered along with my logo and the "advanced search" and "preferences" links. I painted over some stuff for privacy heh. In FireFox, it looks like this ( http://img261.imageshack.us/img261/9625/ex1hu0.jpg ) but in IE, it looks like this ( http://img523.imageshack.us/img523/4631/ex2sm7.jpg ). So basically in IE the search bar and what not is aligned too high! How can I use CSS to make it looks like it does in FireFox, in all browsers!? I learn best by example so thanks much for any help!!!

My probably terrible code is as follows

<td valign="middle">
<a href="/home"><img src="logo.jpg"></a>

<td valign="middle">
<form id="SearchBarForm" action="search.php" method="get">
<input type="text" name="q" size="30" maxlength="150" value="'.($q).'" title="Search">

<select name="FTS"> <!-- FTS = File Type Selections -->

<option value ="File_Type">File Type</option>

<font size=-1><input type="submit" name="Submit" value="Search"></form></font>
<td nowrap>&nbsp;&nbsp;<a href=/advanced_search.phpf>Advanced Search</a><br>&nbsp;&nbsp;<a href=/preferences.php>Preferences</a>

10-06-2007, 11:33 AM
<style type="text/css">
form {margin:0;}
td {vertical-align:top;}

Why use tables for layout (http://www.hotdesign.com/seybold/)?