Адаптивная верстка сайта

[Андрей79]

Здравствуйте, прошу помощи компетентных людей.

При верстке "резиновой шапки" есть следующие проблемы - блоки съезжают один под другой при изменении размеров окна, а хотелось бы, что бы они не выстраивались в столбик, а уменьшались размером.
Код

<div id="headblock">
			<div id="logo_left">
			</div>
			
				<div id="head_center_top"><h1 class="site-title">Инженерные Системы Экологии</h1></div>
				<div id="head_center_bot"><h2 class="site-description">Эксперт чистого вохдуха</h2></div>
				<div id="logo_right">текст 
			</div>
			</div>

И CSS

#headblock {
    
    position: relative;
	background: url(images/head_fon.png) repeat-x;
	color: #141412;
	display: block;
	margin: 0 auto;
	max-width: 1024px;
	min-height: 156px;
	padding: 0 0;
	text-decoration: none;
	width: 100%;
}
#logo_left {

    float: left;
	background: url(images/logo_left.png);
	color: #141412;
    display: block;
	margin: 0 0;
	max-width: 250px;
	min-height: 156px;

	padding: 0 0;
	display: inline;
	width: 100%;
}
#head_center {
    
	
	float: left;
	max-width: 600px;
	min-height: 156px;
	padding: 0 0;
	text-decoration: none;

	width: 100%;
}
#head_center_top {
    float: left;
	max-width: 600px;
	width: 100%;
	min-height: 110px;
	padding: 4.2% 0 0 0;
	text-decoration: none;

	
	
}
#head_center_bot {
    float: left;
	max-width: 600px;
	min-height: 46px;
	padding: 0 0;
	text-decoration: none;
	top: 78px;
	width: 100%;

	text-align: right;
}
#logo_right {
    float: right;
	
	
	color: #cccccc;
	display: block;
	margin: 0;
	max-width: 15%;

	height: 156px;
	padding: 3.3% 0 0 0;
	display: inline;
	width: 100%;
	
}