html - margin between to display table-cell -

i have following html

<div> <div id="one">one</div> <div id="two">two</div> </div> 

and applied following css

#one, #two{     display: table-cell;      vertical-align: middle;      height: 47px;      background: red;     border-collapse: separate;      border-spacing: 10px; } 

demo

but couldn't achieve desired. need space between 2 divs. if give padding value give space not remove background.

you need put border-spacing , border-collapse rules on parent div, not table-cell divs.