Issues with layouts containing multiple columns

[mcorver]

Hi all,

having difficutlies with changing the layout of group containing several columns. I want the first column and its labels to take up 50% of the width and the other 2 columns to take up the remaining half. IT seemed easy, by making the column widths 50%,25%,25% but doing that makes the fields go all over the place. Actually the settings currently used also do not seem to match the outcome... I also tried css in the css.php (not a big fan of that but neccesary sometimes) but can pinpoint only the 1st (left) column there, do not know how to address the other columns. Any help is welcome, wanted to attached screenshot of the situation but do not know how to change it to an allowed format yet) .
Kind regards, Maurice

 

[troester]

First a question: you are really on Fabrik3.0.9 and Joomla2.5?

Per default the labels have a fixed width (class leftCol), so with 3 columns and labels left maybe there's not enough space.
You can try the labels-above template.
Additionally put your custom css in the file /your-template/custom_css.php
http://www.fabrikar.com/forums/index.php?wiki/form-and-details-templates/

Screenshot: uploading a jpg should not be a problem
For CSS debugging best is to have a link directly to your form.

 

[mcorver]

Right you are, i am on Joomla! 2.5.27 still.

 

[mcorver]

anyway, here is the screenshot. Should I/can I move the tread to the other forum?

 

[mcorver]

anybody? Thx

 

[troester]

As I've said:
.leftCol (= the labels) has a fixed width of 130px, you have to override this with custom CSS.

For a multi column form it may be better to use the labels-above template.

For CSS debugging best is to have a link directly to your form.

 

[mcorver]

I understand how that would suppy me with the room to expand the first column with actual values, but that alone doesn't do the trick. How to specify a change to the lenght of the fields in (only) the first column of values? I know how to make the settings of fabrik.element.container specific for a group but not how to make it specific for 1 column in that group. Thanks again

 

[troester]

making the column widths 50%,25%,25%

This is the correct way
You can set a smaller leftCol (in px) in principle (so there's more space for fabrikElementContainer in col1 50% - lefCol width)

or you can use the n-th child
ul li:nth-child(4n-2).fabrikElementContainer
I don't know if it's really (4n-2), you have to try