# CSS / Style Sheet based UI interface

**URL:** <https://forum.kirupa.com/t/css-style-sheet-based-ui-interface/100930>\
**Category:** Uncategorized\
**Created:** [February 4, 2004, 12:27am UTC](https://forum.kirupa.com/t/css-style-sheet-based-ui-interface/100930 "2004-02-04T00:27:28Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![sand858](https://avatars.discourse-cdn.com/v4/letter/s/85e7bf/32.png) [@sand858](https://forum.kirupa.com/u/sand858)\
**Post date:** [February 4, 2004, 12:27am UTC](https://forum.kirupa.com/t/css-style-sheet-based-ui-interface/100930/1 "2004-02-04T00:27:28Z")

</div>

I’m about to go about designing an extensive set of UIs in Flash that will contain a few basic components:

1. Buttons
2. Text areas with scroll bars
3. Labels
4. (Kirupa based) Hover information (label and text with help).
5. Panels

My question is what is the best way to describe these UI pieces in a way that allows me to change the template and automatically the change the button across all instances of the UI pieces, perhaps even in different .swf files?

Second question: assuming I had a button.swf that described the template, how would I organize the button.swf in a way that would allow me to do the following:

// in some new UI layout.  
rightPanel = new RightPanel(); // loads the default panel template  
rightPanel.addButton( new Button( “Some Label”, handleClickSomeLabel ) );  
screen.addPanel( rightPanel );

// later on we define the button call back  
function handleClickSomeLabel()  
{  
// they clicked Some Label  
}

Thanks for the help,

sand858