First up, I would say clean up the code. But, like Jeremy said, you probably want to ditch the tables too.
Also, using a label to associate the text "search" with the form field will help users with screen readers.
By not using tables, playing with the layout becomes much easier.
Also, cleaning up errors ensures you have a good starting point:
Code:
line 14 column 7 - Warning: <input> proprietary attribute "width"
line 14 column 7 - Warning: <input> proprietary attribute "height"
line 14 column 7 - Warning: <input> proprietary attribute "border"
How about this:
HTML 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>
<title>Untitled Document</title>
<style type="text/css">
form#search input,label {
vertical-align: middle;
}
#terms2 {
width: 10em;
}
input#image{
height: 15px;
width: 15px;
boder: none;
}
</style>
</head>
<body>
<div id="searchbox">
<form action="http://www.safariquip.co.uk/cgi-bin/search/ksearch.cgi" method="get"
name="search" id="search">
<label for="terms2">
Search:
</label>
<input name="terms2" id="terms2" type="text" class="texta" size="15" />
<input name="image" id="image" type="image"
src="images/shopping/go.gif" alt="Search" />
</form>
</div>
</body>
</html>
|
