While working on the layout for my webpage, I encountered an issue with an input area and a textarea that I wanted to clone. Everything was functioning correctly, however, I wanted the "+" button to remain attached to the input tag even when the screen size was adjusted. Currently, they are displayed as separate elements, and on smaller screens, they appear on different lines.
Here is the HTML code that I would like to display merged:
<div class="pure-control-group">
<input type="text" name="url[]" class="pure-input-2-3">
<button type="button" class="pure-button button-add">+</button>
</div>
Here is what happens when viewed on a small screen:
You can view the full page layout here.