html - Alignment of Multiple Div inside div -

i have kind of structure.

<div id = "div">     <div id = "div1">         <div id = "div11"></div>         <div id = "div12"></div>     </div>     <div id = "div2">         <div id = "div21"></div>         <div id = "div22"></div>         <div id = "div23"></div>         <div id = "div24"></div>         <div id = "div25"></div>     </div> </div> 

for div2 want inside div have come in line.

i want struuectue

[div21] [div22] [div23] [div24]

and 5th div has come down 4 div.

i tried float left , right, postion not able that.

please tell me how can this?

try

#div21,#div22,#div23,#div24{   display:inline-block; }