Hello Robert,
RobertLair:1) How can I center my Silverlight UserControl on the center of the web page (horizontally and vertically). To reproduce, create a new default Silverlight application in VS2008. I want that default xaml to appear in the center of the page, instead of the top left.
Centering something horizontally is so easy but vertically.Centering div or text vertically is kinda tricky.
YOUR_PROJECTName_TestPage.aspx is the aspx page where you host SL content.
The following code is by-default in that aspx file.
<body style="height:100%;margin:0;">
<form id="form1" runat="server" style="height:100%;">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div style="height:100%;">
<asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/SL2HttpPost.xap" Version="2.0" Width="100%" Height="100%" />
</div>
</form>
</body>
So, you have to change it to the code below.
<%@ Page Language="C#" AutoEventWireup="true" %>
<%@ Register Assembly="System.Web.Silverlight" Namespace="System.Web.UI.SilverlightControls"
TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%;">
<head runat="server">
<title>Test Page For SL2HttpPost</title>
<style type="text/css">
<style type="text/css">
<!--
DIV.sl
{
position: absolute;
left: 50%;
top: 50%;
width: 400px;
height: 300px;
margin-left: -150px; /* half of width */
margin-top: -150px; /* half of height */
background-color: #6699CC;
}
-->
</style>
</style>
</head>
<body style="height:100%;margin:0;">
<form id="form1" runat="server" style="height:100%;">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<!-- Credit : http://milov.nl/code/css/verticalcenter.html -->
<div class="sl">
<asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/SL2HttpPost.xap" Version="2.0" Width="100%" Height="100%" />
</div>
</form>
</body>
</html>
Note: assume that the width and height of XAML is 400x300.
You can also take a look CSS sample from this link.
RobertLair: 2) In trying to get this centered, I attempted to put the <asp:Silverlight> in a table cell. When I did this it no longer appeared. In addition, when I right clicked anywhere on the page, it showed as being a siliverlight application. How can I get a silverlight asset to appear in a specific spot on an aspx page with multiple controls, graphics, etc?
I suggest you not to use table-based layout. The most of web developer stopped using table-based layout since long time back. DIV-layout is much better and flexible than table-based layout.
Hope it help.
(If this has answered your question, please click on "Mark as Answer" on this post. Thank you!)
Best Regards,
Michael Sync
Blog : http://michaelsync.net
Feed : http://michaelsync.net/feed