[SOLVED] CSS styled background for textarea disappears when scrolling

CSS styled background for textarea disappears when scrolling

I'm using javafx to build a sort of todo list program and using CSS to style it. I have an issue that I'm trying to resolve where when I reach the end of my textarea to the point where it starts to scroll and the scrollbar appears, the background from the CSS file I applied to my text area disappears.

Currently this is the code for the CSS file that I have applied to the text area.

.text-area .scroll-pane:fitToWidth:fitToHeight .viewport .content {
-fx-background-color: 
        linear-gradient(
        from 0px 0px to 0px 10.5px,
        repeat,
        gainsboro,
        gainsboro 6.25%,
        cornsilk 6.25%,
        cornsilk
         );

}

The file gives the textarea a notebook-esque look and works perfectly. However as I mentioned, I can't figure out how to get it to repeat/not disappear as soon as the textarea begins to scroll.

Solution

I seem to have found the problem. The path that I got from CSS analyzer is scenebuilder seemed to be an inefficient path to styling the content pane of the textArea: ".text-area .scroll-pane:fitToWidth:fitToHeight .viewport .content". I simply changed it to "text-area .content" and then it seemed to work. The "scroll-pane:fitToWidth:fitToHeight" seemed to be the issue.