How to Float save button to centre on the page title component

edited September 21, 2018 in Questions
How can i float save and cancel buttons on a page title component to the middle of the page.. Right-now I have them on the left side of the page. I tried the following CSS but dint work. div .title-buttons-center .nx-header-right { margin-left: auto; margin-right: auto; }

Comments

  • Conlan O'RourkeConlan O'Rourke ✭✭✭✭
    edited September 21, 2018
    I would recommend using the new Button Set component in Brooklyn release. There is a standard property to adjust the alignment of the buttons (left, center, right). That way, you won't have to bother with any CSS.

    If you absolutely must keep the old buttons on a page title, what I used to do is place the page title component inside a responsive grid which had 3 divisions...placing the page title in the center division and setting the division width property to "Fit to Content". Then I removed the title and sub-title from the page Title. That way, it would float nicely in the center of the responsive grid.

    But again, the new button set component was designed specifically for that purpose.
  • edited September 21, 2018
    Hi Conlan,


    I tried the button set component and i set the buttons position to center. But when i preview the page i am seeing the buttons floating to the left side of the page.

    This is how i see in the Edit page

    image

    This is how it shows up in the preview page

    image

    I don't have any CSS on this page and even if i change the button position to right and preview the page, i am seeing the button on the left side only when i preview the page. How do i solve this issue?
  • Conlan O'RourkeConlan O'Rourke ✭✭✭✭
    edited February 1, 2017
    Hmm...I'm stumped then. I just tested it out in my own instance, and the button set positioning worked fine. Do you have the button set component inside any other layout components (panel set, responsive grid, etc.)?
  • edited February 1, 2017
    No. I don't have Button set component in any other place. I too tested the button component in a sample page and it worked out. But for some reason it is not working on the pop up that i wanted to.
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!