Yahoo! UI Library: TabView – Skinning without using skin class in the Body

I found an issue with the TabView skins and the Body tag.  The examples would lead you to believe that you must have the skin class in the Body tag.   What I found is that you only have to have the skin class in a container such as a DIV.  See below:

Script:

<script type="text/javascript">
    var myTabs = new YAHOO.widget.TabView("divTabDetails");
</script>

HTML:

<div class="yui-skin-sam">
	<div id="divTabDetails" class="yui-navset" style="width: 100%">
	    <ul class="yui-nav">
		<li id="tab1" runat="server" class="selected"><a href="javascript:void();"><em>Tab1</em></a></li>
		<li id="tab2" runat="server"><a href="javascript:void();"><em>Tab2</em></a></li>
	   </ul>
	    <div class="yui-content">
		<div id="divTab1">
			Tab 1 content
		</div>
		<div id="divTab2">
			Tab 2 content
		</div>
	    </div>
	</div>
</div>

Leave a Reply