Img超过屏幕并在底部创建一个滚动条

Question

我遇到了问题。我在这段代码中添加了img：

HTML：

  .homepage-right {
	    position: absolute;
	    right: 0;
	    top: 46em;
    }

    .river-right {
	    padding: 0;
    }

    .img-river-right {
	    float: right;
	    max-width: 50%;
        -ms-transform: rotate(1deg); /* IE 9 */
        -webkit-transform: rotate(1deg); /* Safari 3-8 */
        transform: rotate(1deg);
    }

<section id="homepage-river-right">
        <div class="homepage-right">
            <div class="col-md-12 river-right">
               <img class="img-river-right" src="https://images.unsplash.com/photo-1490644120458-f5e5c71d2ab0?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1350&q=80"> 
            </div>
        </div>        
    </section>


  

我的问题：网络问题

问题是底部的滚动条。我知道她出现的原因，因为我旋转了img并且她超出了屏幕右侧。我的问题是如何切割img以便不创建此滚动条。或者我不能在CSS中，我需要在photoshop中使用完美的img。

谢谢。

Answer 1

在qazxsw poi上添加qazxsw poi qazxsw poi

overflow