Re: Centering a Siliverlight UserControl on a Webpage

mchlSync — Tue, 11 Mar 2008 07:35:37 GMT

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.

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">
    
    </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>
       
        <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.

Centering a Siliverlight UserControl on a Webpage

RobertLair — Tue, 11 Mar 2008 06:42:35 GMT

I am working on two things:

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.

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?

Programming with .NET - General

Re: Centering a Siliverlight UserControl on a Webpage

Centering a Siliverlight UserControl on a Webpage