Come for the products,
stay for the community

The Atlassian Community can help you and your team get more value out of Atlassian products and practices.

Atlassian Community about banner
4,293,273
Community Members
 
Community Events
165
Community Groups

Confiforms - How do I center a form on a page

I have defined the width of my embedded form manually and now would like it to appear centered on a page. Does anyone know the CSS that I need to apply to the registration control to tell it to do this?

Just to be clear, I don't want the content in the form centered (fields, text). I just want the form to display centrally on a page.

3 answers

1 accepted

This is really not something solely for ConfiForms to manage, as it uses the container you are placing it into.

Which means, you need to center the "container"

The easiest way is to use something like a "div" macro from content formatting plugin and adding some CSS styling.

Screenshot 2021-02-26 at 11.36.25.png

To get something like (of course, it depends on the form itself - but you can see it is centrally aligned)

Screenshot 2021-02-26 at 11.36.39.png

Hope it helps

Alex

Thanks Alex - I'll investigate building myself a div macro.

Building a div macro using the user macro will not work for everything because of the bug in how user macros are rendered - our experience... (and yes, reported to Atlassian - https://jira.atlassian.com/browse/CONFSERVER-25507 )

See https://wiki.vertuna.com/display/VERTUNA/Div+container 

So it needs to be built either as a "real" Confluence plugin or some 3rd party used...

Alex

@Matthew Martin simple & effective way to center your embedded form on your page is to:

  1. Add a section macro
  2. Add 3 column macros inside the section macro
  3. Configure the left-most and right-most column macro to have a width of 25%
  4. Configure the center column macro to have a width of 50%
    Screen Shot 2022-06-21 at 4.59.33 PM.png
  5. Place your Confiform Registration macro within the center column macro
  6. Configure your Confiform Registration macro to have a fixed width (1050 was the size width I needed for my form. Your form's width may be different.)

    Screen Shot 2022-06-21 at 4.58.07 PM.png
0 votes
Brant Schroeder Community Leader Feb 25, 2021

@Matthew Martin 

Can you share with me the HTML of the page, specifically just the html of the form and I will be able to give you the CSS.

Hmm - what's the best way to share it? It's about 800 lines.

Suggest an answer

Log in or Sign up to answer
TAGS
Community showcase
Published in Confluence

Confluence: Where work and wellness meet

Feeling overwhelmed by the demands of work and life? With a 25% increase in the prevalence of anxiety and depression worldwide during the pandemic, for most of us, it’s a resounding yes . 🙋‍♀️ ...

727 views 5 21
Read article

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you