centre the login box

Topic: centre the login box (Read 1209 times) previous topic - next topic

centre the login box

February 12, 2020, 10:34:49 PM

I have tried to follow one of the php rad videos that does this but can't get it to work as the classes he uses are different to what i have in the drop down list. I don't know enough about classes to get this working. I have tried various combinations.

Has anyone else done this and happy to share the classes that they put in.

Re: centre the login box

Reply #1 – February 12, 2020, 11:53:58 PM

@Goodhead‍ if you have added the class to your App CSS or if the class is a bootstrap class you can just type in the classes in the select box.

Re: centre the login box

Reply #2 – February 13, 2020, 10:08:38 PM

I added to the column width class. Please see my screen shot attached what it looks like at the moment.

Re: centre the login box

Reply #3 – February 15, 2020, 11:37:36 AM

@Goodhead‍ the class on you screenshot does not center contents, please read the bootstrap docs here https://getbootstrap.com/docs/4.0/utilities/flex/#justify-content

Re: centre the login box

Reply #4 – February 15, 2020, 08:56:48 PM

Is it this sort of code to that i found on that link?

<div class="mx-auto" style="width: 200px;">
Centered element
</div>

Quote from: willvin – February 15, 2020, 11:37:36 AM

@Goodhead‍ the class on you screenshot does not center contents, please read the bootstrap docs here https://getbootstrap.com/docs/4.0/utilities/flex/#justify-content

Re: centre the login box

Reply #5 – February 16, 2020, 01:37:33 PM

@Goodhead‍ d-flex justify-content-center is the class that handles what you need, and that is just what you need to apply to the ColumnWidthOrClass and please click the link again, I just updated it as the previous link was leading to a different thing.

Re: centre the login box

Reply #6 – February 18, 2020, 09:59:28 PM

Thanks for posting the actual code. Works well.

Quote from: willvin – February 16, 2020, 01:37:33 PM

@Goodhead‍ d-flex justify-content-center is the class that handles what you need, and that is just what you need to apply to the ColumnWidthOrClass and please click the link again, I just updated it as the previous link was leading to a different thing.