asked on

How to use external Style sheet in ASP.net Mobile

Hi Experts,
Any one know how to use external Style sheet in ASP.net Mobile?

below are the style sheet that i have created in a ascx page.
----------------------------------------------------------------------------------------------------------
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="mStyle.ascx.cs" Inherits="mStyle" %>
<%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %>
<mobile:StyleSheet Runat="server" ID = "CSS">
<mobile:Style name ="style1" Font-Name ="Arial" BackColor= "#3399ff" Font-Size="Large" />
</mobile:StyleSheet>

Thanks in advance.

myderrick

This time we would find a solution:

First use mobile:Style Name (watch the capitals)

Someone has a similar problem and the discussion in here:
http://forums.asp.net/t/1088153.aspx

I think it is to do with the Doctype or codes....

Additional:
http://www.developershome.com/wap/wcss/wcss_tutorial.asp?page=howToApplyStyles

MD

myderrick

Others:
http://www.asp.net/CssAdapters/srcviewer.aspx?inspect=%2fCssAdapters%2fTreeView.aspx
http://www.asp.net/cssadapters/

MD

mkdev2009

ASKER

Appreciate if some one can give me some sample.

myderrick

You may want to try this. Care must be taken. Keep a backup of your initial code - Just in case
To Attach css file, used code:

Dim objLink As New HtmlLink()
objLink.ID = ID
objLink.Attributes("rel") = "stylesheet"
objLink.Attributes("type") = "text/css"
objLink.Href ="filname.css"
Page.Header.Controls.Add(objLink)

Good luck.

myderrick

Another method would be to put this code in the Page_Load event handler:

HtmlLink link = new HtmlLink();
link.Attributes.Add("rel", "stylesheet");
link.Attributes.Add("type", "text/css");
link.Href = "~/StyleSheetPath"; // Replace with actual path of the style sheet
Page.Header.Controls.Add(link);

I also fond these:

http://forums.asp.net/p/892044/950821.aspx
http://blogs.msdn.com/csimpkins/archive/2008/02/28/using-css-within-ascx-files.aspx

MD

ASKER CERTIFIED SOLUTION

myderrick

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

mkdev2009

ASKER

myderrick, thanks for the links that you provided. I finally found a solution.

This is the solution :

create a user control... You can select a mobile user control template... I had named that as stylesheet.ascx...

<%@ Control Language="C#" AutoEventWireup="true" Inherits="TestApp.stylesheet" Codebehind="stylesheet.ascx.cs" %>
<%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %>

The page by default contains the above two lines of code...

Then type...

<mobile:StyleSheet ID="StyleSheet1" Runat="server">

//You can use various styles here
<mobile:Style Name="exstyle1" Alignment="NotSet" BackColor="#fdfeba" Font-Size="Large" Font-Name="Arial" ForeColor="Red" Font-Italic="True"></mobile:Style>

<mobile:Style Name="exstyle2" Font-Name="Times New Roman"

//End of style defentions
</mobile:StyleSheet>

Then in your aspx page, include this tag inside <body> before the <mobile:form> tag,

<mobile:StyleSheet ID="StyleSheet1" ReferencePath="stylesheet.ascx" Runat="server">
</mobile:StyleSheet>

then you can use the syles to your controls like

<mobile:Form id="Signup_Form" StyleReference="exstyle1" runat="server">

<mobile:TextBox id="txt1" StyleReference="exstyle2" runat="server"/>

myderrick

Glad we solved it....

MD