缩放img上的静态div

Question

是否可以仅对图片进行地址处理（ id 不起作用，因为它包含括号之间的代码），以便在悬停时进行缩放？ Div +文本应保持相同的大小。 我试图以相反的方式缩放div +文本（1 / 1.1 = 0.9）。但当鼠标离开该区域时，它会摇摆不定。

.center {
	position: absolute; 
}

.scrolldownbutton {
    background-color: green;
    position: relative; /* absolute um ueber Text zu schweben*/
    width: 300px;
    height: 300px;
    border: 1px solid black;
    text-align: center;
	line-height: 300px;
	transition: all .5s ease;
}

.scrolldownbutton:hover {
    transform: scale(1.1);
}

.rahmen {
	border: 2px solid yellow;
	margin: 5%;
	height: 90%;
}

.rahmen:hover {
	transition: all .5s ease;
	transform: scale(0.9);
}

.text {
	margin: -10%;
	font-size: 300%;
	color: white;
}


#newYork {
	background-image: url('http://www.travelersjoy.com/images/planning/destinations/new-york-city/newyork1.jpg');
}

<div class="center">
  <div id="newYork" class="scrolldownbutton">
    <div class="rahmen">
      <p class="text">New York</p>
    </div>
   </div>
</div>