field width too long

[Stachura]

I am getting fields running over the form boundaries, and based on the debug (see attached image), the width is calculated into the HTML code and it supersedes any CSS attempts to correct it.

Would anyone know where it is calculated, or if it can be configured out / corrected some other way?

There was another post I found before, (can't locate it now) that was showing some changes to a .js file, but the file is not there in this version...

Much appreciated.

 

[troester]

What are your field settings (width, maxlength) and your content?
Do you have a link to your form?

 

[Stachura]

I have different fields with different lengths (these are character lengths), as well as maximum lengths (also in characters). They vary from 20 to 50 (all below the actual width on the screen). I tested that these values do not impact the calculated width (which is in pixels), and in fact the calculated widths are all the same.

It appears, the style widths are calculated somewhere in PHP (or JS) probably based on the available space. I suspect, the calculation maybe doesn't take into account extra padding or margins or such.

 

[troester]

It's your Joomla template setting
input[type="text"], input[type="password"] {....width:100%}

So add a custom_css.php to the fabrik form template to reset the width
(to auto I assume, not tested)

 

[Stachura]

Thank you for the response.

The text width in template is ok, because in other forms the fields render correctly.

Even if I remove the 100% (which you can try in firebug) in the CSS or provide the custom_css, which I had also tried, the style width in HTML will always overwrite it.

If you like to check, I added color red to the captions and auto width to the elements (which are now visible in firebug under custom css) if you go to the above link- however, the html style width overrides these.

The solution has to be in either some configuration or finding the code to affect or remove the calculation from HTML.

 

[troester]

If you append ?template=beez5 to your URL, using the standard Joomla template the fields are displaying correctly.
If I disable the width:100% in bfcs.../../template.css the field width is switching back nicely to what it should be.

Editing your custom_css in firefox and adding
#form_1 input[type="text"], input[type="password"] {width:auto}
solves the problem, too.
So put
#form_$c input[type="text"], input[type="password"] {width:auto}
in your custom_css.php

 

[Stachura]

Thanks - I tried adding that to custom_css.php - didn't fix it.

I am ok taking out 100% from the template - that fixes the problem (or rather avoids the problem).

It would still be nice to know where the calculation of the width (for HTML) is to fix that as it appears to miss out on some padding or margins (not sure what exactly).

Anyway - thanks again.