I have the following layout:
[![enter image description here](https://i.stack.imgur.com/xeG7w.jpg)](https://i.stack.imgur.com/xeG7w.jpg)

and I want to put some text at bottom of div2 just like in the pic. 

I have the following code:

```html
<style>
        .grey_box {
            background-color: grey;
            width: 680px;
            height: 500px;
        }
        .yellow_box {
            background-color: yellow;
            width: 450px;
            height: 300px;
        }

    </style>
</head>
<body>
    <div class="grey_box">
        <div class="yellow_box">
            <h1>when I say div</h1>
        </div>
    </div>
```