In my FORUMHOME, I have this... (this is a small part)
Code:
<link href="http://demo.yootheme.com/apr08/templates/yoo_ambient/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<link rel="stylesheet" href="http://demo.yootheme.com/apr08/plugins/system/yoo_effects/lightbox/shadowbox.css" type="text/css" />
<link rel="stylesheet" href="http://demo.yootheme.com/apr08/templates/yoo_ambient/css/template.css.php?color=lighting&styleswitcherFont=1&styleswitcherWidth=0&widthThinPx=790&widthWidePx=990&widthFluidPx=0.9" type="text/css" />
<link rel="stylesheet" href="http://demo.yootheme.com/apr08/modules/mod_yoo_slider/mod_yoo_slider.css.php" type="text/css" />
<link rel="stylesheet" href="http://demo.yootheme.com/apr08/modules/mod_yoo_drawer/mod_yoo_drawer.css.php" type="text/css" />
<link rel="stylesheet" href="http://demo.yootheme.com/apr08/modules/mod_yoo_login/mod_yoo_login.css.php" type="text/css" />
<link rel="stylesheet" href="http://demo.yootheme.com/apr08/modules/mod_yoo_accordion/mod_yoo_accordion.css.php" type="text/css" />
<link rel="stylesheet" href="http://demo.yootheme.com/apr08/modules/mod_yoo_carousel/mod_yoo_carousel.css.php" type="text/css" />
<link rel="stylesheet" href="http://demo.yootheme.com/apr08/modules/mod_yoo_toppanel/mod_yoo_toppanel.css.php" type="text/css" />
<script type="text/javascript" src="http://demo.yootheme.com/apr08/templates/yoo_ambient/lib/js/mootools.js.php"></script>
<script type="text/javascript" src="http://demo.yootheme.com/apr08/media/system/js/caption.js"></script>
<script type="text/javascript" src="http://demo.yootheme.com/apr08/modules/mod_yoo_slider/mod_yoo_slider.js"></script>
<script type="text/javascript" src="http://demo.yootheme.com/apr08/modules/mod_yoo_drawer/mod_yoo_drawer.js"></script>
<script type="text/javascript" src="http://demo.yootheme.com/apr08/modules/mod_yoo_accordion/mod_yoo_accordion.js"></script>
<script type="text/javascript" src="http://demo.yootheme.com/apr08/modules/mod_yoo_carousel/mod_yoo_carousel.js"></script>
<script type="text/javascript" src="http://demo.yootheme.com/apr08/modules/mod_yoo_toppanel/mod_yoo_toppanel.js"></script>
<script type="text/javascript">
var YtSettings = { tplurl: 'http://demo.yootheme.com/apr08/templates/yoo_ambient', color: 'lighting', layout: 'left', fontDefault: 'font-medium', widthDefault: 'width-wide', widthThinPx: 790, widthWidePx: 990, widthFluidPx: 0.9 };
</script>
<script type="text/javascript">var YOOeffects = { url: 'http://demo.yootheme.com/apr08/plugins/system/yoo_effects/lightbox/' };</script>
<script type="text/javascript" src="http://demo.yootheme.com/apr08/plugins/system/yoo_effects/yoo_effects.js.php?lb=1&re=1&sl=1"></script>
<script type="text/javascript" src="http://demo.yootheme.com/apr08/templates/yoo_ambient/lib/js/template.js.php"></script>
</head>
<body id="page" class="yoopage font-medium width-wide left showright default yootools-black">
<div id="absolute">
<div class="transparent">
<div id="yoo-toppanel-1" class="yoo-toppanel">
<div class="panel-container" style="top: 0px;">
<div class="panel-wrapper">
<div class="panel" style="height: 340px; margin-top: -340px;">
<div class="content" style="width: 600px;">
<div class="article">
<div><b>Message from Trasion Administrator(s):</b> Please invite all of your friends to Trasion, and get them active! We will always be having competitions on getting more member(s), so just visit the <a href="http://trasion.com/forum/forumdisplay.php?f=2">News and Announcements</a> board to view the latest competitions.</div> </div> <div class="article">
<div class="width50 float-left">
<div style="width: 250px; height: 180px; border: 10px solid #282828; background: url('images/toppanel/trasionlogin.gif')">
</div>
</div>
<div class="width50 float-left">
<div style="float: right; width: 250px; height: 150px; padding: 20px 10px 10px 10px; border: 10px solid #282828; background: url('http://demo.yootheme.com/apr08/images/yootheme/toppanel_login.jpg')">
<form action="http://demo.yootheme.com/apr08/index.php" method="post" name="login">
<span class="default" style="display: block;">
<span class="yoo-login">
<span class="login">
<span class="username">
<input type="text" name="username" size="18" alt="Username" value="Username" onblur="if(this.value=='') this.value='Username';" onfocus="if(this.value=='Username') this.value='';" />
</span>
<span class="password">
<input type="password" name="passwd" size="10" alt="Password" value="Password" onblur="if(this.value=='') this.value='Password';" onfocus="if(this.value=='Password') this.value='';" />
</span>
<input type="hidden" name="remember" value="yes" />
<span class="login-button-icon">
<button value="" name="Submit" type="submit" title="Login"></button>
</span>
<span class="lostpassword">
<a href="http://demo.yootheme.com/apr08/index.php?option=com_user&view=reset">Forgot your password?</a>
</span>
<span class="lostusername">
<a href="http://demo.yootheme.com/apr08/index.php?option=com_user&view=remind">Forgot your username?</a>
</span>
<span class="registration">
<a href="http://demo.yootheme.com/apr08/index.php?option=com_user&task=register">Create an account</a>
</span>
<input type="hidden" name="option" value="com_user" />
<input type="hidden" name="task" value="login" />
<input type="hidden" name="return" value="aHR0cDovL2RlbW8ueW9vdGhlbWUuY29tL2FwcjA4Lw==" />
<input type="hidden" name="c88491b62d3c408e14d10d09536eb85b" value="1" /><br />
</span>
</span>
</span>
</form>
</div>
</div> </div> </div>
</div>
</div>
<div class="trigger" style="left: 50%;">
<div class="trigger-l" style=""></div>
<div class="trigger-m">Login Box</div>
<div class="trigger-r" style=""></div>
</div>
</div>
</div>
</div><script type="text/javascript">
// <!--
var panelFx1 = new YOOtoppanel('yoo-toppanel-1', { offset: 340, transition: Fx.Transitions.expoOut, duration: 500 });
panelFx1.addTriggerEvent('#yoo-toppanel-1 .trigger')
panelFx1.addTriggerEvent('#yoo-toppanel-1 .close');
// -->
</script>
<div style="position: absolute; z-index: 20; top: 0px; left: 0px; width: 135px; height: 135px;">
</div></div>
etc...
Notice the bunch of stylesheets in the top? Well, I want them to somehow end after the last line of code I posted (the </div></div>) because after that, it's my forum, and it's really messing it up...
How can I end a stylesheet? To make it only affect the above code..
More Information