Text Left and Button Right

[rkassebaum]

Say, I want to have text to the left side of the page and a button to the right side of the page. I tried two columns which works on a computer but doesn’t work on smaller devices. What CSS should I enter so these can be in one column and display the text to the left and the button to the right? https://lincolnalumnaedst.org/test-page/

[prakash_s]

Hello @rkassebaum,

Thanks for writing to us.

To align the text and button side by side on the small screen, please add this custom CSS code under X–>Theme Option -->CSS.

@media(max-width: 480px)
{
.e382-2 > .x-row-inner .x-col {
    flex-basis: calc(49% - 1rem) !important;
}
}

The purpose of providing the custom CSS to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.

Hope it helps.
Thanks

[rkassebaum]

Say, I added the code. However, it still looks like the attached image.

. You can see the Logout button should be across from the MEMBERSHIP LEVEL AND SOROR. Any further suggestions?

[ruenel]

Hello @rkassebaum,

Thanks for the updates. Please remove the custom code and revert back to the original desktop appearance of the text and the button on the right side of the page. Click your row element and then in your column layout, make sure that on smaller screens, you maintain two columns:

Best Regards.