title: CSS positioning issues: invalid property value
body: <p>I have some very simple HTML/CSS code, and no matter what I do, I always get an &quot;invalid property value&quot; exception by chrome, and the logo won't position properly.</p>
  <p>Fixed the first problem, but now the image does not move related to the border.</p>
  <pre><code>&lt;html lang=&quot;de&quot; xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&gt;
  &lt;head&gt;
      &lt;meta charset=&quot;utf-8&quot; /&gt;
      &lt;title&gt;my website&lt;/title&gt;
      &lt;style type=&quot;text/css&quot;&gt;
  
          *{ padding: 0; margin: 0; }
  
          .header {
              width: 100%;
              height: 100px;
              border: none;
              border-bottom-style: solid;
              border-bottom-width: 5px;
              position: relative;
              border-bottom-color: rgb(220,30,60);
          }
  
          .logo {          
              position: absolute;
              padding-bottom:50px;
              height: 150%;
              width: auto;                
          }    
        
      &lt;/style&gt;        
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;div class=&quot;header&quot; id=&quot;header&quot;&gt;
          &lt;img id=&quot;logo&quot; class=&quot;logo&quot;  src=&quot;image.png&quot;/&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>