如图,我对一个item 设置了缩放属性,但是没什么用,item 立面的内容还是超出了边界.....然后我对里面各个元素都试着用了下这个属性,但是还是没用,于是迷糊了,这个缩放到底应该怎么用?怎么理解?我想要内容可以随着浏览器大小响应变化,保持沾满整个行

<a class="vc-item vc-item-cell" href="javascript:;">
  <a href="javascript:;" class="vc-item" style="flex-shrink:1;">
  <p class="vc-myitem-media">
  <a target="_black" href="https://item.taobao.com/item.htm?&amp;id=45178076109"><img src="http://img4.tbcdn.cn/tfscom/i4/TB11blKLXXXXXbEXVXXXXXXXXXX_!!0-item_pic.jpg_150x150.jpg" lazy="loaded"></a>
</p>
          <p class="vc-item-content" style="justify-content: flex-start;">
  <p class="vc-item-title-row">
  <p class="vc-item-title">
  925银十二星座项链女日韩国短款锁骨链简约甜美配饰生日礼物吊坠
</p>
              <p class="vc-item-title-after">
  2014-12-23
</p>
</p>
            <p class="vc-item-sub-title">
  
              新品特惠
            
</p>
            <p class="vc-item-text">
  
              39
            
</p>
                <p class="vc-buttons-row" style="width: 100%;">
  <a href="javascript:;" class="vc-button vc-button-fill vc-button-raised color-amber">
  黄色
  <p class="vc-ripple-ink"></p>
</a>
                  <a href="javascript:;" class="vc-button vc-button-fill vc-button-raised color-blue">
  蓝色
  <p class="vc-ripple-ink"></p>
</a>
</p>
</p>
  
</a>
  
</a>