Please note that what you are trying to achieve is not available out of the box and falls beyond the scope of our support. We could however give you some suggestions to get you started but might require some some tweaking on your end based on your setup.
Firstly, settings a page element with absolute attribute is quite tricky although it would come in handy if you want to place something to a specific position. You can read more about it here.
Based on your setup, what I can suggest is instead of setting a height to the columns, you can instead tweaked the JS code here to locate the text element with the most text (longest) then set the rest of the text boxes to that length. This will allow the text areas to be equal, pushing the button to the bottom part and also making the columns equal since the elements inside them now have the same height.
If you do that, the buttons might appear to stick so close to the text and the bottom edge, so you can simple add a CSS code to add a top and button margin to the buttons with the class
If you follow the steps above, you should be able to have this output, for desktop:
Please note that using the snippet linked earlier in the response of this thread will set a specific height to the element and column which will cause an issue when you try to change the width of the device without refreshing the page because it sets a specific height to a certain block where the page is initially load. What you can do it to use the resize function to detect if the device width has changed so the height of the element will resize accordingly.
Hope this will help you get started.