Check out this JSFiddle I created: http://jsfiddle.net/asaakius/5nGYS/7/
In the code, you'll see a small div with the id #menu containing the letter "v". When I remove this div, the textarea and textbox align perfectly and resize together seamlessly.
However, adding the #menu div messes up the alignment. My goal is to have this menu div positioned in the upper right corner of the #textarea element without affecting the text inside it or the alignment of the #textarea and #textbox. Essentially, I want it to appear above the text with a higher z-index (it's the start of a small menu).
Edit
I recently discovered that if I keep the menu's position as absolute, it remains inside the container. But how can I ensure it stays on the right side? I want it consistently positioned in the upper right corner, irrespective of any resizing.