How to align input text next to Edit Profile Picture?

Gcobani Mkontwana

Hi Team

I have a HTML code, but i notice aligning is not good, meaning Chose file is stretch far from left instead of center just like an image and want to align it well. Please assist me on improving this logic below so UI can look good.



    
        
            
            
            



            
            
                
                    Edit Profile Picture:

1 Reply

Know the answer? Post it — somebody with the same question will find it here.

Jayraj Chhaya1y ago

Hi Gcobani Mkontwana,

To enhance the alignment of the "Choose file" input in your HTML code, you can modify the CSS styles and structure slightly. The goal is to ensure that the file input aligns well with the label and maintains a centered appearance.


    
        
            
            



            
                
                    Edit Profile Picture:

Key Changes

Flexbox Alignment: Added justify-content: center; to the .d-flex class to center the label and input together.
Removed Unnecessary Styles: Simplified the CSS for better readability and maintainability.