html - CSS更改元素的高度和宽度

我有一个CSS信封作为元素。我想增加50像素的元素的高度和宽度。我更改了CSS属性，但它不起作用。现在如何增加元素的高度和宽度？

#envelope {
          background: #F66B40;
           width: 300px;
           height: 200px;
           position: absolute;
           left: 50%;
           top: 40%;
           margin-left: -150px;
          border-bottom-left-radius: 20px;
          border-bottom-right-radius: 20px;
          box-shadow: 10px 10px 10px rgba(0,0,0,0.5);
        }

        #lid {
          position: relative;
          top: -150px;
          width: 0px;
          height: 0px;
          border-style: solid;
          border-width: 0 150px 150px 150px;
          border-color: transparent transparent #F66B40 transparent;

        }

        #letter {
          position: relative;
          background: #f6f6f6;
          padding-top:5px;
          padding-left: :5px;
          padding-right:5px;
          top: -150px;
          width: 280px;
          height: 200px;
          left: 10px;
          top: -220px;
          animation: out 5s infinite linear;
          box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
        }

<div id="envelope">
    <div id="lid"></div>
    <div id="letter"></div>
    <div id="left-corner"></div>
    <div id="right-corner"></div>
</div>

JSFIDDLE公司：

https://jsfiddle.net/0L37kehb

最佳答案

更新的CSS

    #envelope {
      background: #F66B40;
       width: 350px;
       height: 250px;
       position: absolute;
       left: 50%;
       top: 40%;
       margin-left: -150px;
      border-bottom-left-radius: 20px;
      border-bottom-right-radius: 20px;
      box-shadow: 10px 10px 10px rgba(0,0,0,0.5);
    }

    #lid {
      position: relative;
      top: -150px;
      width: 0px;
      height: 0px;
      border-style: solid;
      border-width: 0 175px 150px 175px;
      border-color: transparent transparent #F66B40 transparent;

    }

    #letter {
      position: relative;
      background: #f6f6f6;
      padding-top:5px;
      padding-left: :5px;
      padding-right:5px;
      top: -150px;
      width: 330px;
      height: 250px;
      left: 10px;
      top: -220px;
      animation: out 5s infinite linear;
      box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
    }

    #left-corner {
      position: relative;
      top: -315px;
      left: 10px;
      width: 0px;
      height: 0px;
      border-style: solid;
      border-width: 150px 0 0 300px;
      border-color: transparent transparent transparent #F66B40;

    }

    #right-corner {
      position: relative;
      top: -470px;
      left: 50px;
      width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 0 0 150px 300px;
    border-color: transparent transparent #F66B40 transparent;
    }

    @keyframes out {
      0% {top: -220px;}
      25% {top: -200px;}
      50% {top: -220px;}
      75% {top: -200px;}
    }