hello,

I have the following splitter and have two issues:

        $("#splitter").igSplitter({      
            height: "610px",
            orientation: 'vertical',
            panels: [
                { collapsible: true, size: "50%" },
                { collapsible: true, size: "30%" }
            ]
        });

1) I can't seem to change the default "white" color of the splitter, so I wrapped a <div> around it with my own color. Except that if I collapse the right panel, the splitter color defaults back to white. It also goes to white if I resize my browser window (left to right, or right to left).

2) I often lose the collapse/expand icon when collapsing the right panel. if I then widen my browser window, the icon shows up ! Then of course my right panel goes white again !

Is some styling that someone can guide me through to override the default WHITE in the panels ?

Does the fact that I'm putting the splitter INSIDE an igLayout div have something to do with this ?

For example, here's an outline of my markup

<div id="layout" style="width:100%; height: 620px;">        
        <div class="left">   SOME TEXT HERE        </div>
        <div class="right"> SOME TEXT HERE       </div>
        <div class="header" >Razor Configuration</div>
        <div class="footer" >Razor Configuration</div>

        <div class="center">
              <div id="splitter">
                
                   <div class="panel1" >   <!-- add a div here to get control of the color -->

                              <!-- A BUNCH OF HTML ELEMENTS HERE... -->

                   </div> 

              </div>

        </div>

</div>

thank you.

Bob