[SOLVED] Alligning field horizontally in tab

Hello,
I would like to know if it's possible to allign fields in a tab horizontally via CSS.
In fact lets' say I have field CB_1 , CB_2, CB_3 showing in a user's profile tab they are always displayed vertically like

---example vertical----
CB_1
CB_2
CB_3

---

Instead I would like them to be shown horizontally

---example horizontalal----
CB_1 | CB_2 | CB_3

---

If YES would you please give me few lines code for css styling ?
Many thanks in advance.
M.-)

Yes, as each field is just contained in a div element. Shouldn't need any CSS though as you can move the fields to a tab that's in a not shown on profile position then use a Custom HTML field with substitutions to format them directly next to each other. Example as follows.

[cb:userfield field="CB_1" /] | [cb:userfield field="CB_2" /] | [cb:userfield field="CB_3" /]

See the below tutorial for further substitution usage information.

www.joomlapolis.com/documentation/279-community-builder/tutorials/18353-using-substitutions-throughout-cb

If you still prefer to do this with CSS the below example will set 3 fields to equal size.


Replace CB_1_FIELD_ID_HERE, CB_2_FIELD_ID_HERE, and CB_3_FIELD_ID_HERE with the ids of your 3 fields. You can add custom CSS to CB using CBs built in CSS override functionality shown below.

www.joomlapolis.com/blog/kyle/18711-template-css-overrides-made-easy

Thanks a lot !
Have a nice day.
M.-)

Hello Kyle,

I used this solution to present fields in a horizontal line and it works:

Except it appears to stop privacy and conditional options from working. Therefore it is not possible to show/hide the field under certain circumstances.
Is this the case?
In order for CB Privacy and CB Conditional to work correctly, do fields have to be displayed in the "normal" way on tabs?

Many thanks.

[cb:userfield field="FIELD_NAME" /] substitutions should still respect privacy and conditions. They should output empty if privacy or condition prevents viewing of the field. Ensure you're not viewing the users profile as a CB Moderator as moderators are exempt from privacy controls and some conditions (depends on the condition).

Kyle,

Yes, the code:

Does obey privacy and conditional requirements and this is as expected.

However, if I have the following in a custom HTML field:

Where the field cb_course_date has a type set to "date", it does not appear in the tab! But if I use:

in the same custom HTML field, when viewing the tab it clearly shows the date.
But this latter CB substitution does not comply with privacy and conditional settings.

I am confused, why is this? I simply wish to use the first CB substitution for the date field but can't. It will save lots of [cb:if] statements.

Thank you.