Автоматическое масштабирование img внутри div

[phenom]

Добрый день! Столкнулся с такой проблемой, у меня есть страница, состоящая из левой и правой колонок таблицы. Левая колонка должна занимать 35% экрана, а правая соответственно 65% по ширине, высота должна быть 100%, все должно вписываться в окно браузера без появления прокруток. В левой колонке у меня будет меню, тут проблем нет, а в правой колонке будет меняться фон, который будет состоять из картинок размером 1200 X 1200 px. И меня интересует, как можно вписать изображение в блок (он у меня зеленый на скриншоте) желательно с сохранением пропорций, что бы картинка не растягивалась, и не растягивался сам блок. Уже юзал imagefit плагин, но не помогло. Может, есть какие-то другие варианты? Спасибо.
блок.jpg

<style type="text/css">
.left_side
{
	background-color:black;
	width:35%;
}
.right_side
{
	background-color:green;
	width: 65%;
	

}
.main_table
{
	background-color:black;
}
.main_image
{
	width:100%;
	height:100%;
}
</style>
<table width="100%" height="100%" cellspacing="0" cellpadding="0" border="0" class="main_table">
	<tr>
		<td class="left_side" valign="top">
		
		</td>
		<td class="right_side" valign="top" align="center">
			<div class="main_image">
					<img src="/images/route-66-wallpapers_8561_1200x1200.jpg">
			</div>
		</td>
	</tr>
</table>

[danik.js]

#block{
    background: url(../background.jpg") no-repeat center;
    background-size: cover;
}

[phenom]

#block{
    background: url(../background.jpg") no-repeat center;
    background-size: cover;
}

Спасибо! Думаю подойдет..обрезается конечно немножко изображение..но думаю это не критично..и вариантов других больше нет)

[danik.js]

Чтобы картинка не обрезалась, есть свойство contain.
http://htmlbook.ru/css/background-size
Кстати это свойство не работает в старых браузерах.

[phenom]

Чтобы картинка не обрезалась, есть свойство contain.
http://htmlbook.ru/css/background-size
Кстати это свойство не работает в старых браузерах.

Спасибо! Да и так нормально смотрится...все пропорционально...