Textarea not properly displayed in Firefox in detail view

M

menno

Member
Hi All

some of the Front end templates for Details view are having difficulties displaying in Firefox.

Some of them go far behind their width (up to 4000px) as in the default and tabs templates.
The tabs template also put the label above instead of before the elements content.

Some of them stay within their width but are only displaying one line as in the bluesky, mint and nolabels templates.

IE8 has a minor problem with some of the (longer) textareas. The next element is displayed on top of the last lines of the textarea's content.

Looking for solutions in the forum I found signals of problems with displayBox in Firefox. But I don't think that displayBox is involved in all these templates that are coursing problems.

My site is going to use textareas as the main way of presenting its content.
So for me it is quite important that this problem is solved.
Is there a solution or a workaround?

TIA
menno

J!2.57 - latest github
 
I can't see any of these effects.
What are your textarea settings?
What is your Joomla template?
Do you have a link to your site?
 
Hi Troester

setting of my most important textarea:
Options
Width 300
Height 4
Eval No
Default
Placeholder
WYSIWYG Editor Yes
Limit
Show max limit Yes
Max limit 3000
Limit type Characters
Tagify
Tagify No
Custom tagify URL
Truncate
Truncate size 4
Show hover text No
Tip location top
Publishing
Status Published
Add to page title No
RSS
all No
Tips
Tip text
Eval No
Tips over element No
Tip hover location Top
Show tips in detail view No
Show tips in list view No
Comment
Access
List view settings
List settings
Show in list No
Link to details No
Allow ordering No
Heading label
Custom link
Custom link in details No
Use as row class No
Include in list query No
Icons
Replace with icons No
Icon hover text No
Static icon file (no .ext!)
Filters
Filter type none
Exact match No
Filter access Public
Full word match No
Required No
Filter data Use global
Order by none
Include in search all No
Include in advanced search No
CSS
Heading class
Heading CSS
Cell class
Cell CSS
Calculations
all No
Validations
none
JavaScript
none

Here is a link to a list:
http://www.permacultuur.nu/pm/index.php/adressen
The details view Front end template is nolabel.
Til now I thought that all details views of with list had the sam kind of problem, but I just found out that 2 of the links in this is list are linking to details view with only presenting one line of the textarea's content (but with the right width) and the other is showing all the lines but the width there is at least double of what it should be.

Another list with the default template for front end viewing:
http://www.permacultuur.nu/pm/index.php/diensten/details/14/3

Will this help to clarify?
TIA
menno
 
This is the same problem I am having. I didn't find a good solution, except that it works with the Labels Above template fine. So, until it's resolved, I've set all my forms to the Labels Above template. The problem seems to be where the form.js script gets the 'normal' size and sets that size.
 
One more thing. I dug pretty deep into the form.js and it almost seems that for the script to work properly, the form templates all need to be restructured so they have the same div levels. The are a bit different structurally. But I certainly could be missing the boat here. There's probably a more simple solution.
 
Agreed, davez. In all my test situations Labels Above template did the job without problems. But actually I want Nolabels on almost al details views.

Somehow it must be possible to melt these two into one that's really working well.
If I have some spare time...
 
The difference between labels-above and the other templates is:
about line 132 (in no-labels)
#{$view}_$c .fabrikForm .fabrikGroup ul .fabrikElementContainer,
#details_$c .fabrikElementContainer,
#{$view}_$c .fabrikElementContainer{
padding:5px 10px;
margin-top:10px;
background:none !important;
display:-webkit-box;
display:-moz-box;
display:box;
width:50%;
}

and about line 308
#{$view}_$c .fabrikElement {
margin-left: 10px;
-webkit-box-flex:1;
-moz-box-flex:1;
box-flex:1;
}

It seems -moz-box isn't working as it should.
So until this is fixed maybe it will do with custom templates:
http://fabrikar.com/wiki/index.php/3.x_Form_Templates

copy the template you want to use, select the copy in your form
edit template_css.php and delete these ...box CSS

It would be easier to add a custom_css.php to the original templates but I don't know how to "override" display:-moz-box
 
Thanx Troester and Cheesegrits

waiting for a more final solution I decided to copy the labels above template and moved two lines of code from default_group.php that had to do with the labels.
It is now displaying as wanted: no labels and all textareas correct.

thanks again
menno
 
From what I had looked at those templates will need to be rebuilt because they have different number of div layers. So, I also am just customizing labels-above and have created some custom ones.
 
You must log in or register to reply here.

Useful links

  • Create a Fabrik Account (Downloads)
  • Create a Forum Account
  • Fabrik Wiki
  • Fabrik 4 Changelog /Install /Upgrade
    • We are in need of some funding.
    More details.

    Thank you.

    Members online

    No members online now.
    Total: 148 (members: 0, guests: 148)
    Back
    Top