Hey guys! I decided to try out the CSS Grid tool to create my design, and everything seemed like it was going great. But I am having an issue adding an element. I would like to make a scrollable div window so that I can add the text content in sort of like this.
Every time I add a div in the middle section it appears to cut into the top “from: sam taylor” area or after making adjustments it comes just under the “from: sam taylor” area. The goal is to have it flush against the border like the image above, but I am not sure if I am approaching the CSS Grid System correctly or if I should be using maybe another feature within Webflow. This is the last step I need to finish the framework for my concept. Any help/guidance would be fantastic! :~) Thanks if you read all of this. My read-only link is at the bottom of this post.
Thanks so much Noah! It looks pretty cool in your GIF. By any chance do you have any advice on how to make a filled background div that would cover the inner box like in the screenshot I attached?
By any chance did you move the text block or anything when you changed the size of it so that it could be scrollable? I am trying to get the text more center vertically, but on my screen it looks like this.
There appears to be a large gap. Also thanks @gilson!! I managed to add a tint behind the text content. I’m not sure if this is because the CSS grids change based on the window size. For context, I am working from a MacBook Pro. I wasn’t sure if yours might just look different because you might be using a desktop. I am probably just overlooking something again.