так используйте transform при hover как показано выше

все, вопрос решил. обернул дополнительно div и прописал:

width: 360px;
overflow: hidden;
height: 225px;

рони, спасибо за помощь!

так поставьте это свойство в родителя

<style type="text/css">.shortstory{
                       width:360px;
                       overflow:hidden;
                       height:225px;
                     }

                     .shortstory .img{
                       width:360px;
                       height:225px;
                       transition:0.5s;
                       background-position:center center;
                       background-size:cover;
                       background-repeat:no-repeat;
                       text-align:center;
                       margin-bottom:10px;
                       -webkit-transition:0.5s;
                       -moz-transition:0.5s;
                       -o-transition:0.5s;
                       transition:all .8s ease-in-out;
                     }

                     .shortstory .img:hover{
                       -webkit-transform:scale(1.2);
                       -moz-transform:scale(1.2);
                       -o-transform:scale(1.2);
                       transform:scale(1.2);
                     }
                     </style>
<div class="shortstory">
   <div class="img" style="background-image:url(http://www.androidpro.net/data/programs/images/sunny-forest-live-wallpaper_programView5_83983.png);"></div>
</div>
<div class="shortstory">
   <div class="img" style="background-image:url(http://www.wallpaperup.com/uploads/wallpapers/2014/04/09/328071/big_thumb_ff2d993a3140bfed6424550c461d77aa.jpg);"></div>
</div>

внутри <div class="shortstory"> помимо картинки еще есть вывод других данных.
я так сделал:

<div><div class="img" style="background-image:url(http://www.androidpro.net/data/programs/images/sunny-forest-live-wallpaper_programView5_83983.png);"></div></div>