Why isn't my image aligning to the bottom of my grid column?

Why isn't my image aligning to the bottom of my grid column?

I'm trying to setup a grid system with one side a form and the other one an image. Now the problem is that I want everything to go to the bottom of the viewport, but for some reason the image doesn't go to the bottom of the screen.

I'm trying to setup a grid system with one side a form and the other one an image. Now the problem is that I want everything to go to the bottom of the viewport, but for some reason the image doesn't go to the bottom of the screen.

I've already tried putting a height: 100vh on body, * and the image itself but it didn't change.

.login-section {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-areas: "form form form form form form form form map map map map";
  align-items: center;
  justify-items: center;
}

.login-section .login-form { grid-area: form; }

.login-section .login-map { grid-area: map; width: 100%; overflow-x: hidden; } <div class="login-section"> <div class="login-map"> <img src="../img/map.png" alt="photo map"> </div> <div class="login-form"> <div class="login-form-back"> Bla bla login </div> </div> </div>


html css css3

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

Colorful Drop-Down Menu in HTML CSS | Drop-Down Menu in HTML CSS

Download File: https://drive.google.com/file/d/1PpbVEw_mSvUPfA0WqdgcKWSoc-VnqgqW/view?usp=sharing Want to create a Drop-Down Menu with HTML & CSS? Check out ...

CSS3 Clip-path Transform Effects on Scroll with Video Background | Html CSS Vanilla Javascript

CSS3 Clip-path Transform Effects on Scroll with Video Background | Html CSS Vanilla Javascript

Know Everything About HTML With HTML Experts

HTML Assignment Help Australia @30% OFF from Sample Assignment, with Our Best HTML assignment help experts. Get HTML homework help online at affordable price. 100% Plag free assignment solution.

An Introduction to HTML & CSS

At the heart of any general website or web page are lines of code in HTML and CSS. HTML, the web development language to render content and CSS, which styles the content.

How to write text on image in HTML CSS | Text on image in CSS

In this video tutorial, I am going to tell you how you can write some text on the image by using HTML and CSS. Here I use the CSS position attribute. Other P...