A user has created a .net usercontrol for a gallery that functions well within their web application as long as there is a gallery on the page. However, when attempting to validate the page using XHTML 1.0 Strict, an error occurs stating that the document type does not allow the "link" element here.
After some research, it was discovered that the issue stems from having a stylesheet embedded within the usercontrol and called from the body of the masterpage, causing validation problems. While moving the stylesheet to the masterfile could resolve this, the user prefers not to have the stylesheet loading on every single page. The question arises about how to best handle this situation, with the goal being to keep the stylesheet contained within the usercontrol for easier management.
Advice on this matter would be greatly appreciated. Additionally, there is uncertainty about whether the javascript code should also be removed from the usercontrol.
The user control in question is as follows:
<%@ Control Language="C#" Debug="true" AutoEventWireup="true" CodeFile="Gallery.ascx.cs" Inherits="Gallery" %>
<%@ Register Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI.WebControls" TagPrefix="asp" %>
<link ID="FancyboxCSS" type="text/css" rel="stylesheet" href="" runat="server" />
<link ID="FancyboxButtonsCSS" type="text/css" rel="stylesheet" href="" runat="server" />
<script type="text/javascript">
$(document).ready(function () {
$(".fancybox").fancybox({
maxWidth: 800,
maxHeight: 800,
fitToView: true,
aspectRatio: true,
openEffect: 'fade',
closeEffect: 'fade',
nextEffect: 'fade',
prevEffect: 'fade',
helpers: {
title: {
type: 'outside'
},
overlay: {
opacity: 0.8,
css: {
'background-color': '#000'
}
},
buttons: {}
}
});
});
<div id="gallery" runat="server">
//images here
</div>