Center Button in Responsive Layout

  • farhan86a

    (@farhan86a)


    9 years, 10 months ago

    Hi,

    Here is my website http://formsify.in/

    I was able to create a clickable drop down button by inserting html into a column. To put that button in center I put two blank columns aside (right and left) the column having html code of the button. Now the centering of the button is fine (applied margin-left:20px to the html content) in the desktop mode of the layout but when I turn it responsive and reduce the screen size the button fails to get centered.

    What can I do to bring it right in the center in responsive layout too.

    Thanks

    https://wordpress.org/plugins/beaver-builder-lite-version/

Viewing 1 replies (of 1 total)
  • Plugin Contributor Ben Carlo

    (@hinampaksh)

    9 years, 10 months ago

    Hey Farhan,

    Thanks for getting in touch!

    So the problem here is that you’re centering the button by manually placing margins on the sides. Setting the HTML wrapper to align center should take care of it.

    Try setting those margins to 0, add the class fl-center-html to the HTML module under Advanced > CSS Selectors > Class, then add the CSS snippet below under Tools > Layout CSS/JS > CSS.

    .fl-center-html .fl-html {
  text-align: center;
}

    Let us know how it goes! 🙂

    Ben

Viewing 1 replies (of 1 total)

The topic ‘Center Button in Responsive Layout’ is closed to new replies.