How Do I Put the Greek Letter Pi on a Button?

Discussion in 'HTML' started by kvnsmnsn@hotmail.com, Feb 3, 2007.

  1. Guest

    I'm trying to build a calculator in XHTML, and I've got a button that
    currently reads "x <- pi", meaning load 3.141592654 into register x.
    Is there some way to alter the button's label so that in the place of
    "pi" I have the actual Greek letter pi? Any help on this would be
    greatly appreciated.

    ---Kevin Simonson

    "You'll never get to heaven, or even to LA,
    if you don't believe there's a way."
    from _Why Not_
    , Feb 3, 2007
    #1
    1. Advertising

  2. Scripsit :

    > I'm trying to build a calculator in XHTML, and I've got a button that
    > currently reads "x <- pi", meaning load 3.141592654 into register x.
    > Is there some way to alter the button's label so that in the place of
    > "pi" I have the actual Greek letter pi?


    Yes, and you can even have a real arrow character instead of the clumsy
    "<-".

    <input type="button" id="compute" value="x ← π">

    The above uses character references, with hexadecimal Unicode values. You
    might find the following "mnemonic" alternative more readable as source:

    <input type="button" id="compute" value="x &larr; &pi;">

    Browser support tends to be fairly good these days, for relatively common
    characters like the simple arrows and basic Greek letters.

    Note, however, that common browser defaults may mean that the font used in
    buttons is a sans-serif font where the letter small pi looks like
    reduced-size capital pi, instead of the shape of small pi that people know
    from math texts. Moreover, its typically in a small font size, smaller than
    copy text! The following would usually help:

    <style type="text/css">
    input { font-family: Georgia, Times New Roman, serif; font-size: 100%; }
    </style>

    (You may wish to use class attribute on the <input> element and restrict the
    styling to selected <input> elements only, using a class selector in CSS.)

    --
    Jukka K. Korpela ("Yucca")
    http://www.cs.tut.fi/~jkorpela/
    Jukka K. Korpela, Feb 3, 2007
    #2
    1. Advertising

  3. J.O. Aho Guest

    wrote:
    > I'm trying to build a calculator in XHTML, and I've got a button that
    > currently reads "x <- pi", meaning load 3.141592654 into register x.
    > Is there some way to alter the button's label so that in the place of
    > "pi" I have the actual Greek letter pi? Any help on this would be
    > greatly appreciated.


    You could always try to use &pi; instead of your current pi

    --

    //Aho
    J.O. Aho, Feb 3, 2007
    #3
  4. kvnsmnsn wrote:

    > Is there some way to alter the button's label so that in the place of
    > "pi" I have the actual Greek letter pi?


    If your page uses some form of Unicode character encoding (e.g. UTF-8),
    this should be fairly easy:

    <input value="x ⇠π">

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me ~ http://tobyinkster.co.uk/contact
    Geek of ~ HTML/CSS/Javascript/SQL/Perl/PHP/Python*/Apache/Linux

    * = I'm getting there!
    Toby A Inkster, Feb 4, 2007
    #4
  5. Michael Guest

    >> Is there some way to alter the button's label so that in the place of
    >> "pi" I have the actual Greek letter pi?


    Just tried
    <INPUT TYPE=submit VALUE='&pi;'>
    which works on both my IE 6 and FF 1.5

    Regards

    Michael.
    Michael, Feb 4, 2007
    #5
  6. Guest

    On Feb 3, 3:34 pm, "Jukka K. Korpela" <> wrote:

    =The above uses character references, with hexadecimal Unicode values.
    You
    =might find the following "mnemonic" alternative more readable as
    source:
    =
    =<input type="button" id="compute" value="x &larr; &pi;">

    Thanks, Jukka, this worked great.

    My next question is, is there a way in XHTML to print an arrow that
    points both ways? Is there a "&rlarr;", maybe?

    Also, how do you put subscripts and superscripts on buttons? I've
    currently got an "x ^ y" that I would rather represent as "x" with "y"
    as a superscript, and a "log_x y that I would rather represent as
    "log" with "x" as a subscript.

    ---Kevin Simonson

    "You'll never get to heaven, or even to LA,
    if you don't believe there's a way."
    from _Why Not_
    , Feb 6, 2007
    #6
  7. Scripsit :

    > My next question is, is there a way in XHTML to print an arrow that
    > points both ways? Is there a "&rlarr;", maybe?


    Things don't work quite that way, by making up entities. In HTML, you can
    use any Unicode character. A small minority of them has entity names defined
    for them, but that's rather irrelevant. So basically you could take a look
    at the Unicode block Arrows and then consider how widely the characters in
    it are available in _fonts_ in common use; this is relevant, entities are
    not. Incidentally, there are entities &harr; for left right arrow and &hArr;
    for left right double arrow, and &harr; alias ↔ is probably what you
    want, since it's basically the two-way counterpart of &larr;

    (XHTML adds nothing but confusion to HTML, as far as practical use as
    delivery format of web pages at present is considered.)

    > Also, how do you put subscripts and superscripts on buttons?


    There are Unicode characters for some subscripts and superscripts, but most
    of them (beyond superscript 1, 2, and 3) are poorly supported in fonts, and
    the repertoire is rather limited - there is no superscript y for example.

    The other approach is to use <sub> or <sup> markup, but for that, you need a
    context where markup (tags) are allowed, and a value="..." attribute (or any
    attribute for that matter) is not such a context. There's the possibility of
    using the <button> element, where you specify the button text as the content
    of the element, where markup is allowed.

    > I've currently got an "x ^ y" that I would rather represent as "x" with
    > "y"
    > as a superscript, and a "log_x y that I would rather represent as
    > "log" with "x" as a subscript.


    You could use

    <button type="submit" name="foo" value="bar">
    <var>x</var><sup><var>y</var></sup>
    </button>
    <hr>
    <button type="submit" name="foo2" value="bar2">
    log<sub><var>x</var></sub><var>y</var>
    </button>

    Beware that the rendering of button texts, especially with superscripts or
    subscripts, can be rather awkward, so consider using a suitable style sheet
    like

    button { font-family: Verdana; font-size: 100%; }

    The main problem with <button> is that Internet Explorer (including version
    7) gets it fundamentally wrong. It does not send data like foo=bar or
    foo2=bar2 as it should; instead it sends the name of the button followed by
    an equals sign and the _content_ of the element, resulting in a mess
    foo=%3CVAR%3Ex%3C%2FVAR%3E%3CSUP%3E%3CVAR%3Ey%3C%2FVAR%3E%3C%2FSUP%3E
    This may not matter if you can arrange things so that all the buttons have
    unique names, so that you can look at the name part of the data only, or if
    you use buttons other than submit buttons (e.g. <button type="button" ...>
    for scripted buttons that are supposed to work using client-side JavaScript.

    --
    Jukka K. Korpela ("Yucca")
    http://www.cs.tut.fi/~jkorpela/
    Jukka K. Korpela, Feb 6, 2007
    #7
  8. Roedy Green Guest

    Roedy Green, May 9, 2007
    #8
  9. Scripsit Roedy Green:

    > On 5 Feb 2007 16:03:01 -0800, wrote, quoted or
    > indirectly quoted someone who said :
    >
    >>
    >> My next question is, is there a way in XHTML to print an arrow that
    >> points both ways? Is there a "&rlarr;", maybe?

    >
    > see http://mindprod.com/jgloss/htmlcheat.html#ENTITIES


    Sometimes it might make some sense to comment on a discussion three months
    after others finished discussing it (and after correct answers to questions
    were given), but that's hardly one of those cases. You are referring to your
    page that contains many bogosities even on a casual look. Luckily you shout
    in red: "I found the easiest way to learn HTML is to look at other people's
    examples, to cut and paste from them, and to experiment by fiddling the
    various parameters to see what the visual effects are." So anyone who takes
    advice from you probably deserves all the mess he gets.

    --
    Jukka K. Korpela ("Yucca")
    http://www.cs.tut.fi/~jkorpela/
    Jukka K. Korpela, May 10, 2007
    #9
  10. Mike Duffy Guest

    "Jukka K. Korpela" <> wrote in
    news:X5G0i.161720$:

    > Scripsit Roedy Green:
    >
    >> I found the easiest way to learn HTML is to look at other
    >> people's examples, to cut and paste from them, and to experiment


    > anyone who takes advice from you probably deserves all the mess he gets.


    But he said it was the *easiest* way to learn HTML, not the *best* way.
    Mike Duffy, May 10, 2007
    #10
    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. dungping
    Replies:
    27
    Views:
    3,373
    Jukka K. Korpela
    Sep 2, 2005
  2. vertigo

    big letter -> small letter

    vertigo, Jul 6, 2004, in forum: Python
    Replies:
    4
    Views:
    744
    Reinhold Birkenfeld
    Jul 6, 2004
  3. Tony Meyer

    RE: big letter -> small letter

    Tony Meyer, Jul 6, 2004, in forum: Python
    Replies:
    0
    Views:
    491
    Tony Meyer
    Jul 6, 2004
  4. Andrew McNamara

    Re: big letter -> small letter

    Andrew McNamara, Jul 6, 2004, in forum: Python
    Replies:
    2
    Views:
    739
    Scott David Daniels
    Jul 6, 2004
  5. =?gb2312?B?yMvR1MLkyNXKx8zs0cSjrM37vKvM7NHEsru8+7z

    how to print the GREEK CAPITAL LETTER delta under utf-8 encoding

    =?gb2312?B?yMvR1MLkyNXKx8zs0cSjrM37vKvM7NHEsru8+7z, May 29, 2007, in forum: Python
    Replies:
    8
    Views:
    697
    Ragnar Ouchterlony
    May 29, 2007
Loading...

Share This Page