В общем суть такая, есть код

  <div class="mycity">
          <div class="lcity">
          </div>
          <div class="ccity">
                Тут выводим текст
          </div>
          <div class="rcity">
          </div>
  </div>

.mycity {
	width:300px;
	height:10px;
	margin-left:750px;
	margin-top:-15px;
}

.lcity {
	background:url(left_city.png) no-repeat;
	width:20px;
	height:26px;
}

.ccity {
              background:url(centr_city.png);
	width:30px;
	height:26px;
	margin-left:20px;
	margin-top:-21px;
}
	
.rcity {
	background:url(right_city.png) no-repeat;
	width:36px;
	height:26px;
	margin-left:auto;
	margin-top:-48px;
}

А теперь значит суть проблемы, левая картинка стоит на месте, просто отображает часть, в средней пишется текст, соответственно при изменении длины текста центральный блок либо увеличивается вправо, либо уменьшается влево, суть проблемы в том, что правая картинка должна ездить вместе с центральным, но она стоит на месте, то есть если текст длинный, то он просто ее закрывает своим бэкграундом. Как решить данную проблему?