Bootstrap 4: Footer not at bottom

Question

I know this question was probably asked some hundred times, but sadly no answer that I found in here really helped me.

I tried these answers for example:

Answer 1

You can use built-in bootstrap class to achieve this.

What you need is the container to be a column flex container . class to use are : d-flex flex-column

To set the container to height:100% you can apply the class h-100to html, body and the container or add to the container style height:100vh;

For the footer, a margin-top:auto will do, the class to use is : mt-auto;

example below to run in full page mode

    
        
        

            
            

                

                    

                        


    
        
            
            
                MyPage
            
        
    

                    
                    
                    

                        

                            

                                Link1
                            
                            

                                
                                Link2
                            

                            
                                

                                    
                                    Link3
                                
                            

                            
                        
                    
                    
                
            
            

            
                
                    

                        

                            

                                

                                    
                                        Login
                                    
                                
                                

                                            Login Now!
                                        
                            
                        
                    
                

                
                
        

            

    

        

            

            

                

                    

                        E-Mail
                        
                    
                
            
            

                

                    

                        Password
                        
                    
                
            
            

                

                    
                        Forgot Password?
                    
                
            
            

                

                    Login
                
            
        
        
    

            
        

                

            

            
            

                

                    
                        

                            
                                Link1 |
                            
                            Link2 |
                            Link3
                        
                        

                            Crafted with Love by Me
                        
                    
                
            
            
        

        
    

codepen updated https://codepen.io/anon/pen/PBpgNN

---

reminder for boostrap classes https://getbootstrap.com/docs/4.5/utilities/flex/ about sizing see https://getbootstrap.com/docs/4.5/utilities/sizing/