title: Why is CSS so complicated?
body: <p>I am reading a CSS tutorial, and saw such a definition:</p>
  
  <pre><code>.content div {
      -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
      -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
      box-shadow:inset 0px 1px 0px 0px #ffffff;
      background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
      background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
      filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
      background-color:#ededed;
      -webkit-border-top-left-radius:6px;
      -moz-border-radius-topleft:6px;
      border-top-left-radius:6px;
      -webkit-border-top-right-radius:6px;
      -moz-border-radius-topright:6px;
      border-top-right-radius:6px;
      -webkit-border-bottom-right-radius:6px;
      -moz-border-radius-bottomright:6px;
      border-bottom-right-radius:6px;
      -webkit-border-bottom-left-radius:6px;
      -moz-border-radius-bottomleft:6px;
      border-bottom-left-radius:6px;
      text-indent:0;
      border:1px solid #dcdcdc;
      display:inline-block;
      color:#777777;
      font-family:arial;
      font-size:15px;
      font-weight:bold;
      font-style:normal;  
      line-height:50px;   
      text-decoration:none;
      text-align:left;
      text-shadow:1px 1px 0px #ffffff;
  }
  </code></pre>
  
  <p>A simple DIV tag needs so much code to style. How to learn all these? Is it really necessary?</p>