title: How do I stylize a Text Shape in JavaFX using a CSS style sheet without assigning it a style-class?
body: <p>I have a fairly simple JavaFX control that I am trying to stylize with a CSS stylesheet.
  I have the background set up fine but I have several Text shapes that are necessary because the control itself can vary in size and I want to scale the text with the control.</p>
  
  <p>I am trying to stylize the text in a CSS with <code>.text{/*CSS Code*/}</code> but it's not working:</p>
  
  <pre><code>.text{
     -fx-fill: #818181;
     -fx-effect: innershadow( three-pass-box , rgba(0,0,0,0.7) , 6, 0.0 , 0 , 2 );   
  }
  </code></pre>
  
  <p>When I open the FXML file in Scene Builder I have to apply it a style-class before I see the effect.</p>
  
  <p>I wouldn't care but I also want to apply effects when hovering or clicking on the text shapes and evidently with a style class accessing the pseudo-class :hover doesn't work, and by extension I will presume no other pseudo-class works either:</p>
  
  <pre><code>.text:hover{
      -fx-fill: #818181; 
  }
  </code></pre>
  
  <p>This is the rest I have:</p>
  
  <pre><code>root {
      display: block
  }
  
  .root{
      -fx-background-color: linear-gradient(
          from 0% 0% to 100% 100%, #b478ff 0%, #9400d3 100%
      );
  }
  </code></pre>
  
  <p>I set the root layout (a gridpane) style-class to "root" and that works (i can see the background gradient colors just fine).</p>
  
  <p>I love the idea of CSS but I can never ever seem to get it to work and it drives me nuts. What am I doing wrong here? To text shapes not have accessible CSS pesudo-classes? Or even classes at all? What am I missing from this?</p>