This topic is locked

Center Logo on Login Page

5/22/2024 12:26:14 PM
PHPRunner General questions
P
PK author

Hello,
I am trying to center my logo on the top of the login page:

img alt

I have set the cell that holds the logo to align center but this is what I get

img alt

How can I make sure the logo appears in the top center?

Thanks
Percy

D
david powell 5/23/2024

I had the same problem in exactly the scenario - aligning items in cells generally seems a bit unpredictable at times, and similar problems occur elsewhere too.

I use the 'padding' option from the right bar on page designer for the element you are trying to position. It is a bit hit and miss, but you can get it pretty well to where you are intending it to go.

Perhaps admin have a better alignment solution...

P
PK author 5/23/2024

Hi David,
Thanks for your response. Padding was actually my first attempt and eventually I got it looking, but once I switch to mobile view it now aligns all the way to the extreem right.
As you said, I hope admin or someone else has a solution that works on all browser sizes

Thanks
Percy

admin 5/23/2024

The answer to inquires like this is very simple: CSS

See CSS examples here:
https://xlinesoft.com/phprunner/docs/customizing_styles_examples.htm

Also there are two videos that explain in depth the CSS topic:
https://www.youtube.com/watch?v=_DmMYRCUtU8
https://www.youtube.com/watch?v=yFnD38oslIc

P
PK author 5/31/2024

Thanks Sergey.
I have gone through the examples and vidoes on youtube but I cant seem to find one that is for my specific case. My css knowledge is terrible so I plan to take a crash course in the basics soon like I did with JS and PHP before I started using PHPRunner.
For now is some could assist with sample code to center the image without havig to use padding, that would be great.

Thanks again.

fhumanes 5/31/2024

Hello,

I will explain how I do the adjustments.
In the browser I use (I use Firefox, but with CRHOME it works the same), press the option to inspect the page code and see:

img alt

I detect that there is a column, which is not in design and is the one that does not let me get the center of the window.

img alt

I try to make the settings until I understand that I "like" how it looks.

img alt

Already knowing what I have to do, I include it in the "Custom CSS" file of my project.

img alt

I generate and check that I have planned.

img alt

Greetings,
fernando