I have the following html and styles apply fine when they are defined within the page but when I move the style to a .css it doesn't apply (using bootstrap with jsp so not sure if that applies or not).
NOTE: I have other styles in that .css that are styling html properly on the .jsp page.  Just not this particular wontStyle class.
index.jsp
<body>
 <div id="wrapper">
   <div class="container">
     <div class="row-fluid">
       <div class="span2">
         <div class="well">
           <div class="wontStyle">  <!-- This won't style in .css but will style inside page -->
If I apply the following in the page  tag it applies the margin and padding (it works).
   <style>
     .wontStyle{
        margin-top: -9px !important; 
        padding-bottom: 18px !important;
    } 
  </style>
However, if I move the style to mystyle.css it won't apply the styles anymore (doesn't work)?
mystyle.css
 .wontStyle{
    margin-top: -9px !important; 
    padding-bottom: 18px !important;
} 
included in my index.jsp
<link href="content/css/mystyle.css" rel="stylesheet">
How can I get it to apply styles from my .css file?
EDIT/UPDATE:
The issue was with the following bootstrap modal collapse style missing a } was breaking wontstyle when placed below the collapse.
 .collapse  {
         .transition(height .15s ease);
        position:relative;
        overflow:hidden;
         height: 0;
         &.in {
          height: auto; 
 }
I didn't see any errors in chrome on console for .css.  How can I catch something like this in the future (css pages failing to load or breaking mid-point/etc,)?