Two divs in the same row after and before zoom-in/zoom-out

Two divs in the same row after and before zoom-in/zoom-out

pI have two divs here: a href=http://jsfiddle.net/TXSfN/
rel=nofollowhttp://jsfiddle.net/TXSfN//abr CSS CODES:/p precode#div1{
background-color: red; display: inline-block; width: 50% } #div2{
background-color: blue; width: 20% display: inline-block; height: 263px;
float: right; } /code/pre pI'm trying to set the two divs in the same line
also after zoom-in/zoom-out in browser(CTRL +/CTRL -). The problem isn't
with setting the two divs in the same line, it's with the zoom-in/out,
when I zoom-in/out the div with the long content get's longer with the
height and the one with the short content stay as it is, so they aren't
now in the same row. Is there a way to set the two divs in the same row
for every action(zoom-in/out) WITHOUT srollbar?. You can check this
solution here: a href=http://jsfiddle.net/wVpwp/1/
rel=nofollowhttp://jsfiddle.net/wVpwp/1//a, I want the same as it with the
same functions but without the scrollbar(both get longer on zoom in and
both get shorter on zoom out)/p