www.webdeveloper.com
Results 1 to 2 of 2

Thread: span tag with guotes inside value attribute

  1. #1
    Join Date
    Aug 2013
    Posts
    6

    span tag with guotes inside value attribute

    I am trying to use css to shorten button text for use in hand-held devices. The demo code below illustrates the shortened text in the link but I can't get the same behavior for the submit button. I thought there may be a way to accomplish this with php. Any help would be greatly appreciated.

    <!DOCTYPE html>
    <head>
    <link rel="stylesheet" type="text/css" href="demo.css">
    </head>

    <?php
    if (isset($_POST['lastname'])) {
    print("Last name = ". $_POST['lastname']);
    }
    ?>

    <html>
    <head>
    <title>Demo</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    </head>

    <body>
    <br>
    <form action="demomain.php" method="post">
    Enter lastname: <input type="text" name="lastname">
    <input type="submit" name="submit" class="button-type" value="Submit<span class=&quot;short&quot;> Name</span>"><br>
    <br>
    <a href="testpage.php" class="button-type">Go to test<span class="short"> page from form</span></a>
    </form>

    </body>
    </html>

    .button-type {
    type: button;
    border: 1px solid black;
    padding: 2px 5px;
    background-image: linear-gradient(to bottom, #FAFAFA, #C1C1C1);
    text-decoration: none;
    }
    .short {
    display: none;
    }

    <!DOCTYPE html>

    <html>
    <body>

    This is the test page.

    </body>
    </html>

  2. #2
    Join Date
    Mar 2011
    Posts
    1,108
    You can't include HTML mark-up in the 'value' attribute. Use the element's CSS rule to style the text.

    p.s. There is no CSS property named 'type'.
    Rick Trethewey
    Rainbo Design

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles