title: Customizing facebook fan box css
body: <p>HTML, with CSS set to a file on localhost:</p>
  
  <pre><code>&lt;div id="fb-root"&gt;&lt;/div&gt;
  &lt;script src="http://connect.facebook.net/en_US/all.js#xfbml=1"&gt;&lt;/script&gt;
  &lt;fb:like-box href="http://www.facebook.com/pages/abc/143772917800992?created" width="200" height="550" show_faces="true" stream="false" header="false" css="http://localhost/abc/templates/index/images/fb.css?1" &gt;
  &lt;/fb:like-box&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>@charset "utf-8";
  /* CSS Document */
  .fan_box a:hover{
    text-decoration: none;
  }
  .fan_box .full_widget{
    height: 200px;
    border: 0 !important;
    background: none !important;
    position: relative;
  }
  .fan_box .connect_top{
    background: none !important;
    padding: 0 !important;
  }
  .fan_box .profileimage, .fan_box .name_block{
    display: none;
  }
  .fan_box .connect_action{
    padding: 0 !important;
  }
  .fan_box .connections{
    padding: 0 !important;
    border: 0 !important;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: bold;
    color: #666;
  }
  span.total{
    color: #FF6600;
    font-weight: bold;
  }
  .fan_box .connections .connections_grid {
    padding-top: 10px !important;
  }
  .fan_box .connections_grid .grid_item{
    padding: 0 10px 10px 0 !important;
  }
  .fan_box .connections_grid .grid_item .name{
    font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
    font-weight: normal;
    color: #666 !important;
    padding-top: 1px !important;
  }
  .fan_box .connect_widget{
    position: absolute;
    bottom: 0;
    right: 10px;
    margin: 0 !important;
  }
  .fan_box .connect_widget .connect_widget_interactive_area {
    margin: 0 !important;
  }
  .fan_box .connect_widget td.connect_widget_vertical_center {
    padding: 0 !important;
  }
  </code></pre>
  
  <p>Facebook doesn't seem to be loading the CSS file. What's the problem?</p>