Coldfusion Autosuggest and CSS problem

Hello experts.
I m using the Autosuggest function in my form and i found out that using this i have a misfunction with my table.I mad a test table to show the problem.When i have the Autosuggest="#modellist#" in my input-text the table has another 'form' and place than if i have not.
You can test it.
Any help?
Here is the 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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-7" />
<title>Untitled Document</title>
<style type="text/css">
<!--
.tableclass {
	border: thin solid #0C0;
}
.form-text {
	font-size: 11px;
	display: block;
	text-align: left;
	color: #333333;
}
.SubSubTabletd {
	padding-top: 3px;
	padding-bottom: 2px;
	vertical-align: top;
}
.selectleftbig {
	font-size: 11px;
	display: block;
	width: 100%;
	margin-bottom: 2px;
	height: 20px;
	color: #333333;
}
.textfield {
	font-size: 11px;
	width: 97%;
	height: 16px;
}
.SubSubTableSearch2 {
	font-weight: normal;
	width: 97%;
	height: auto;
	padding-top: 8px;
	border: thin solid #0C0;	
}
.textfield_modellbig {
	font-weight: bold;
	font-size: 11px;
	color: #000099;
	width: 97%;
}
-->
</style>
<cfinclude template="Includes/DynlistqueriesSearch.cfm">
<!--- End queries ---> 
 
</head>
 
<body><div style="width:664px">
<cfform>
<table  class="SubSubTableSearch2">
   <tr>
                <td width="31%" class="SubSubTabletd">
                    <span class="form-text">
					  <strong>Test1</strong>
                    </span>
                    <select name="S_Test1" class="selectleftbig" id="S_Test1">
                    <option value="">All</option>
                    </select>
                    </td>
                    <td width="4%">&nbsp;</td>
                    <td width="31%">
                    <span class="form-text">Test2</strong></span>
                      <select name="S_Test2" id="S_Test2" class="selectleftbig">
                      <option value="">All</option>
                       </select>
                    </td>
                    <td width="4%">&nbsp;</td>
                    <td width="30%"><span class="form-text">
                         <strong>Test3</strong>
                         </span>
                     <cfif listlen(modellist)>
       <cfinput  type="text" name="S_Test3" class="textfield_modellbig" value="" maxlength="22"  Autosuggest="#modellist#" />
       <cfelse> 
       <cfinput  type="text" name="S_Test3" class="textfield_modellbig" value="" maxlength="22" /> 
       </cfif>
                </td>
                </tr>
                <tr>
                <td class="SubSubTabletd"><span class="form-text">
                          <strong>Test4</strong></span>
                        <select name="S_Test4" class="selectleftbig">
                         <option value="">All</option>
                         </select>
                </td>
                <td>&nbsp;</td>
                <td>
                 <span class="form-text"><strong>Test5</strong> </span>
                     <select name="S_Test5" id="S_Test5" class="selectleftbig">
                     <option value="" selected="selected">All</option>
                     </select>
                     </td>
                        <td>&nbsp;</td>
                  <td><span class="form-text"><strong>Test6</strong>
                  </span>
       <cfif listlen(modellist)>
       <cfinput  type="text" name="Test6" class="textfield_modellbig" value="" maxlength="22"  Autosuggest="#modellist#">
       <cfelse> 
       <cfinput  type="text" name="Test6" class="textfield_modellbig" value="" maxlength="22"> 
       </cfif>
       </td>
                </tr>
</table>
</cfform>
</div>
</body>
</html>

Open in new window

LVL 2
PanosAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

azadisaryevCommented:
sorry, i do not quiet get it - what exactly is the problem?
it seems to be working just fine...

Azadi
0
PanosAuthor Commented:
Here are the two screenshots.
With and without.Please test this in firefox!
with-autosuggest.gif
without.gif
0
Answering4uAntCommented:
The only thing I can see different is the Test5 and Test6 boxes aren't as wide, is this the issue you are referring to?
0
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

Answering4uAntCommented:
sorry Test3 and Test 6 boxes
0
PanosAuthor Commented:
And the table is placed to the top and left
0
azadisaryevCommented:
yui.css file, which cf loads when you have autosuggest input, has this style definition in it:

body {margin:0; padding:0}

which re-sets the browser's default margin/padding for <body> tag (i.e. 8px in FF).

so, juts add something like
body {margin:10px}
to your css, and that's sorted out!

Azadi
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
azadisaryevCommented:
and to make the text inputs NOT change their size, add this to your css:

.autosuggest, .autosuggest div {width:100%}

Azadi
0
PanosAuthor Commented:
Thank you azadi.
I was trying to solve this myself 3 days now !!
regards
panos
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Servers

From novice to tech pro — start learning today.