Alternative to <table> layout in HTML -

So right now I have a webpage setup with a couple of overflow with just one size of the browser window: scroll In it, the page is originally organized into two columns and three lines of a line.

My page (in short):

  & lt; Table & gt; I do not want to use tables for style / formatting, so my question is how I will do this migration. ; & Lt; TR & gt; & Lt; TD & gt; & Lt; Div style = "overflow: scroll;" & Gt; & Lt; Div & gt; Luggage 1 & lt; / Div & gt; & Lt; Div & gt; Stuff1A & lt; / Div & gt; & Lt; / Div & gt; & Lt; / TD & gt; & Lt; TD & gt; & Lt; Div style = "overflow: scroll;" & Gt; & Lt; Div & gt; Luggage 2 & lt; / Div & gt; & Lt; Div & gt; Luggage 2 a and lieutenant; / Div & gt; & Lt; / Div & gt; & Lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; & Lt; Input type = "submit" & gt; & Lt; Input type = "submit" & gt; & Lt; Input type = "submit" & gt; & Lt; / TD & gt; & Lt; TD & gt; & Lt; Input type = "submit" & gt; & Lt; Input type = "submit" & gt; & Lt; Input type = "submit" & gt; & Lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; & Lt; Text area & gt; Stuff3 & lt; / Text field & gt; & Lt; / TD & gt; & Lt; Td> & Lt; Multiple & gt; Select & lt; / Select & gt; & Lt; / TD & gt; & Lt; / TR & gt;  

Problem essentially i nest & lt; Div & gt; Without a second nested & lt; Div & gt; / Code> on a new line:

  & lt; Div style = "overflow: scroll;" & Gt; & Lt; Div & gt; Stuff4 & lt; / Div & gt; & Lt; Div & gt; Stuff4A & lt; / Div & gt; & Lt; / Div & gt; & Lt; Div style = "overflow: scroll;" & Gt; & Lt; Div & gt; Stuff5 & lt; / Div & gt; & Lt; Div & gt; Stuff5A & lt; / Div & gt; & Lt; / Div & gt;  

I think that I want to display two scrolled areas on the same row above and I & lt; Textarea & gt; can not be used because the text requires multiple colors to see available links). For those interested, the page will eventually be the staffing side of a completely in-browser instant message tech support system for a university's CS department.

Well, you can do this in a basic way by letting your page appear in six and lt; Div & gt; s:

  & lt; Div class = "left" id = "l1" & gt; 1 & lt; / Div & gt; & Lt; Div class = "true" id = "r1" & gt; 2 & lt; / Div & gt; & Lt; Div class = "left" id = "l2" & gt; 3 & lt; / Div & gt; & Lt; Div class = "true" id = "r2" & gt; 4 & lt; / Div & gt; & Lt; Div class = "left" id = "l3" & gt; 5 & ​​lt; / Div & gt; & Lt; Div class = "true" id = "r3" & gt; 6 & lt; / Div & gt;  

Then you type some CSS:

  div.left {float: left; Clean both; }  

And you should do something like this:

  1 2 3 4 5 6  

no nested code > & Lt; Div & gt; Required.