Creating a group of resizable sections

I have a very very simple layout for a web application that I’d like to build and be able to resize the sections, but I’m not sure the best way to do this in HTML5. I’m assuming I may use [div] tags and then use JavaScript to manipulate the dragging and resizing but I wanted to see if there was a more practical way. Like [frameset] and [iframe] but more modern since those ways are gone/going away.

I’d like a layout like this with the ability to resize…


If you are making the elements resizeable then you will just basically need to lay out them out with fixed widths and heights and set overflow to auto. Obviously most of your problems will be scripting in order to maintain uniform heights and widths on resize but the css itself html would be pretty simple.

You can use flex box for some automatic equal height elements or floats with set heights for the top section. I guess if the whole thing is always to remain a fixed height then you could absolutely place the elements and account for the flow quite easily.

I think most of your work will be on the scripting side to drag and resize everything appropriately.

As for frames and iframes then I don’t see that there is a need for that unless of course you are having different sources in each div and even if that was the case then you would be better of with some other method (ajax perhaps).

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.