Как зафиксировать блок что бы он не «скакал» при изменении бэкграунда?

Question

[HelenaS]

Доброе утро!
Суть проблемы - на блоке при наведении увеличивается бэкграунд. В этом же блоке есть блок с тестом, который при наведении тоже увеличивается и смещается.
Пробовала задать абсолютное позиционированние, не помогло. Вот сам код

<a href="#" class="marble">
        <div class="wrap-title-stone">
             <span class="title-stone">мармур</span>
             <i class="icon-ico-01"></i>
	</div>
    </a>

.marble {
		background: url(/img/marble.jpg) no-repeat center center;
	    -webkit-background-size: cover;
	    -moz-background-size: cover;
	    -o-background-size: cover;
	    background-size: cover;
	    min-height: 50rem;
	    transition: all .3s ease-in-out;
	    -webkit-transition: all .3s ease-in-out;
	     z-index: -1;
	    &:hover {
	    	-webkit-transform: scale(1.2);
	    	transform: scale(1.2);
		}
		&:after {
		    content: " ";
		    position: absolute;
		    top: 0;
		    left: 0;
		    width: 100%;
		    height: 100%;
		    background: rgba(0, 0, 0, 1);
		    opacity: 0;
		    transition: .3s all;
		    }
		&:hover:after {
			opacity: 0.5;
		} 
}

.wrap-title-stone {
	display: block;
    position: absolute;
    bottom: 10px;
    z-index: 1000;
}

.title-stone {
	text-transform: uppercase;
	color: #fff;
	font-size: 6rem;
	position: absolute;
    bottom: 0;
    padding-left: 4rem;
    z-index: 100;
    display: block;
    border: 1px solid red;
    width: 96.6rem;    	
}

Comments

[Андрей Б.]

HelenaS background увеличивается потому что вы растянули псевдоэлемент. Объясните что в итоге вы хотите получить?

[HelenaS]

Андрей Б.: мне нужно, что бы background-img увеличивалось при наведении и затемнялось. Но при этом текст оставался на своем месте.

[Ankhena]

HelenaS: увеличивайте background-size

[HelenaS]

Ankhena W: спасибо!!!)

[Андрей Б.]

Ankhena W HelenaS это не сработает, транзишен работает только числовыми значениями. Вам нужно увеличивать сам псевдоэлемент в котором картинка https://jsfiddle.net/s6mmsad0/

[HelenaS]

Андрей Б.: Спасибо за вариант)

[Ankhena]

Андрей Б.: да, с транзишеном не сработает.

[Андрей Б.]

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

[HelenaS]

Андрей Б.: Андрей, спасибо за большое за помощь. Мне помог вариант с увеличением background-size