Question

I know this might look like an old question but Im trying to put 3 divs side by side but the middle div should stretch with the form resizing. I found this here and used their code but it doesnt work. The right div still gets pushed down bellow the div instead of being next to it.

Here is an example of what I have but like I said the right div gets pushed down bellow the div instead of being next to it.
Can someone please share their well earned knowledge!

Answer 1

HTML:

<div class="mainDiv">
  <div class="left">Left</div>
  <div class="center">Center</div>
  <div class="right">Right</div>
</div>

CSS:

.mainDiv{ position: relative;}
.left{ position: absolute; left: 0; top: 0; width: 100px; }
.right{ position: absolute; right: 0; top: 0; width: 100px; }
.center { margin: 0 100px; }

JSFiddle

Updated Fiddle as per your new requirement 🙂