CSS to webcontrols

Discussion in 'ASP .Net' started by neilmcguigan@gmail.com, Oct 7, 2005.

  1. Guest

    you can apply a style to an element type, class or id like this:

    input
    {
    font-family:Tahoma;
    }

    this would apply the Tahoma font to all "<input..." elements

    ..MyClass
    {
    font-size:70%;
    }

    this would apply a font-size of 70% to all html elements with
    class="MyClass" attribute

    #MyId
    {
    margin:0px;
    }

    this would apply a margin of 0px to all elements with id="MyId"
    attribute

    you can also nest styles, like this:

    #MyTable th
    {
    font-weight:bold;
    }

    this would apply a bold font to all "<th>" elements for the item with
    id="MyTable"

    HTH

    Neil
     
    , Oct 7, 2005
    #1
    1. Advertising

  2. Roger Moore Guest

    Hi all,

    I have a beginner's question:

    If webcontrols are rendered to suit different browsers using different HTML
    syntax for each, how can I create a unified CSS stylesheet to them (using
    the cssStyle attribute).

    What I say is that I need to know which HTML tag i'm applying the style to,
    in order to know which CSS styles are relevant to it.

    Thanks in advance,
    Roger.
     
    Roger Moore, Oct 7, 2005
    #2
    1. Advertising

  3. "Roger Moore" <> a écrit dans le message de news:
    ...
    > Hi all,
    >
    > I have a beginner's question:
    >
    > If webcontrols are rendered to suit different browsers using different
    > HTML syntax for each, how can I create a unified CSS stylesheet to them
    > (using the cssStyle attribute).
    >
    > What I say is that I need to know which HTML tag i'm applying the style
    > to, in order to know which CSS styles are relevant to it.
    >


    Simple : you avoid System.Web.UI.WebControls.* (you only use real value
    added cases such as repeater, datagrid, etc.), you use :
    System.Web.UI.HtmlControls.* . This also gives you a good chance of
    achieving Firefox compatibility (once you have updated your browsercaps).
     
    Michel de Becdelièvre, Oct 7, 2005
    #3
  4. Mr Newbie Guest

    Example.

    <style type="text/css">
    <!--
    INPUT {
    background-color: #99ccff;
    color: black;
    font-family: arial, verdana, ms sans serif;
    font-weight: bold;
    font-size: 12pt
    }

    TEXTAREA {
    background-color: navy;
    border: black 2px solid;
    color: white;
    font-family: arial, verdana, ms sans serif;
    font-size: 12pt;
    font-weight: normal
    }

    ..altButtonFormat {
    background-color: #c0c0c0;
    font-family: verdana;
    border: #000000 1px solid;
    font-size: 12px;
    color: #778899
    }

    ..altTextField {
    background-color: #ececec;
    font-family: verdana;
    font-size: 12pt;
    color: #09c09c
    }

    ..radioStyle {
    background-color: #FF0000;
    border: #000000 solid 1px;
    font-family: verdana;
    font-size: 12px;
    color: #000000
    }
    -->



    "Roger Moore" <> wrote in message
    news:...
    > Thanks for answering, but I'm afraid you didn't understand my question:
    > ASP.NET renders webcontrols as different HTML tags for different HTML
    > versions, browsers etc. so when I apply a cssStyle to an ASP.NET
    > webcontrol I don't know if I'm actually applying it to INPUT, TEXTAREA or
    > whatever HTML tag ASP.NET chooses to use for my <asp:textbox/> (I take
    > this tag only as an example - other tags may use a broad variety of other
    > interchanging HTML tags) control.
    >
    > I hope I made myself clear this time.. thanks again..
    >
    > <> wrote in message
    > news:...
    >> you can apply a style to an element type, class or id like this:
    >>
    >> input
    >> {
    >> font-family:Tahoma;
    >> }
    >>
    >> this would apply the Tahoma font to all "<input..." elements
    >>
    >> .MyClass
    >> {
    >> font-size:70%;
    >> }
    >>
    >> this would apply a font-size of 70% to all html elements with
    >> class="MyClass" attribute
    >>
    >> #MyId
    >> {
    >> margin:0px;
    >> }
    >>
    >> this would apply a margin of 0px to all elements with id="MyId"
    >> attribute
    >>
    >> you can also nest styles, like this:
    >>
    >> #MyTable th
    >> {
    >> font-weight:bold;
    >> }
    >>
    >> this would apply a bold font to all "<th>" elements for the item with
    >> id="MyTable"
    >>
    >> HTH
    >>
    >> Neil
    >>

    >
    >
     
    Mr Newbie, Oct 7, 2005
    #4
  5. Roger Moore Guest

    Thanks for answering, but I'm afraid you didn't understand my question:
    ASP.NET renders webcontrols as different HTML tags for different HTML
    versions, browsers etc. so when I apply a cssStyle to an ASP.NET webcontrol
    I don't know if I'm actually applying it to INPUT, TEXTAREA or whatever HTML
    tag ASP.NET chooses to use for my <asp:textbox/> (I take this tag only as an
    example - other tags may use a broad variety of other interchanging HTML
    tags) control.

    I hope I made myself clear this time.. thanks again..

    <> wrote in message
    news:...
    > you can apply a style to an element type, class or id like this:
    >
    > input
    > {
    > font-family:Tahoma;
    > }
    >
    > this would apply the Tahoma font to all "<input..." elements
    >
    > .MyClass
    > {
    > font-size:70%;
    > }
    >
    > this would apply a font-size of 70% to all html elements with
    > class="MyClass" attribute
    >
    > #MyId
    > {
    > margin:0px;
    > }
    >
    > this would apply a margin of 0px to all elements with id="MyId"
    > attribute
    >
    > you can also nest styles, like this:
    >
    > #MyTable th
    > {
    > font-weight:bold;
    > }
    >
    > this would apply a bold font to all "<th>" elements for the item with
    > id="MyTable"
    >
    > HTH
    >
    > Neil
    >
     
    Roger Moore, Oct 7, 2005
    #5
  6. Roger Moore Guest

    Thanks Michael,

    I understand you recommend using repeater - that's was my default, but I
    really do want to use some of the more complex .NET webcontrols.
    You've mentioned datagrid: how do I know which set of HTML tags are involved
    when .NET renders this tag (on all browsers that is)?.. it's easy to assume
    it only uses table tags (TD, TR, TBODY etc) - but how can I make sure that,
    for exampe, it won't stick a SPAN to one of the TDs?

    Thanks,
    Roger.


    "Michel de Becdelièvre" <> wrote in message
    news:ud$...
    >
    > "Roger Moore" <> a écrit dans le message de news:
    > ...
    >> Hi all,
    >>
    >> I have a beginner's question:
    >>
    >> If webcontrols are rendered to suit different browsers using different
    >> HTML syntax for each, how can I create a unified CSS stylesheet to them
    >> (using the cssStyle attribute).
    >>
    >> What I say is that I need to know which HTML tag i'm applying the style
    >> to, in order to know which CSS styles are relevant to it.
    >>

    >
    > Simple : you avoid System.Web.UI.WebControls.* (you only use real value
    > added cases such as repeater, datagrid, etc.), you use :
    > System.Web.UI.HtmlControls.* . This also gives you a good chance of
    > achieving Firefox compatibility (once you have updated your browsercaps).
    >
    >
    >
    >
    >
     
    Roger Moore, Oct 7, 2005
    #6
  7. Scott Allen Guest

    On Fri, 7 Oct 2005 22:01:18 +0200, "Roger Moore"
    <> wrote:
    >
    >If webcontrols are rendered to suit different browsers using different HTML
    >syntax for each, how can I create a unified CSS stylesheet to them (using
    >the cssStyle attribute).
    >


    This is a tough question to answer. On one hand it's nice to work with
    server controls because they present a higher level of abstraction.
    Someday we will think of HTML as a primitive assembly language for the
    web.

    In 2.0 we have skin files, which are a server-side type of stylesheet,
    but as I'm sure someone will point out, not a standard. Nevertheless,
    they make it easy to manage and style the complex server side controls
    like DataViews and Calendars.

    I've written a bit about Themes and Skins here:

    http://www.odetocode.com/Articles/423.aspx
    http://odetocode.com/Blogs/scott/archive/2005/09/01/2144.aspx

    --
    Scott
    http://www.OdeToCode.com/blogs/scott/
     
    Scott Allen, Oct 8, 2005
    #7
  8. Roger Moore Guest

    Thanks,

    But since I'm using 1.1, it's back to "good old HTML" for me when creating
    user controls..
    Fortunately enough, I am not really required for one of the datagrid (etc.)
    fancy functionalities in my app.

    "Scott Allen" <> wrote in message
    news:...
    > On Fri, 7 Oct 2005 22:01:18 +0200, "Roger Moore"
    > <> wrote:
    >>
    >>If webcontrols are rendered to suit different browsers using different
    >>HTML
    >>syntax for each, how can I create a unified CSS stylesheet to them (using
    >>the cssStyle attribute).
    >>

    >
    > This is a tough question to answer. On one hand it's nice to work with
    > server controls because they present a higher level of abstraction.
    > Someday we will think of HTML as a primitive assembly language for the
    > web.
    >
    > In 2.0 we have skin files, which are a server-side type of stylesheet,
    > but as I'm sure someone will point out, not a standard. Nevertheless,
    > they make it easy to manage and style the complex server side controls
    > like DataViews and Calendars.
    >
    > I've written a bit about Themes and Skins here:
    >
    > http://www.odetocode.com/Articles/423.aspx
    > http://odetocode.com/Blogs/scott/archive/2005/09/01/2144.aspx
    >
    > --
    > Scott
    > http://www.OdeToCode.com/blogs/scott/
     
    Roger Moore, Oct 8, 2005
    #8
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Eric
    Replies:
    4
    Views:
    749
    clintonG
    Dec 24, 2004
  2. tom watson

    print.css and screen.css

    tom watson, Sep 9, 2003, in forum: HTML
    Replies:
    1
    Views:
    483
    Jukka K. Korpela
    Sep 9, 2003
  3. Joshua Beall
    Replies:
    1
    Views:
    452
    Bertilo Wennergren
    Dec 10, 2003
  4. Noozer
    Replies:
    10
    Views:
    2,160
    Mitja
    Oct 13, 2004
  5. Roger Moore

    CSS and WebControls

    Roger Moore, Oct 7, 2005, in forum: ASP .Net Web Controls
    Replies:
    1
    Views:
    116
    Roger Moore
    Oct 8, 2005
Loading...

Share This Page