SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Wizard WorldNews's Avatar
    Join Date
    Nov 2007
    Posts
    1,033
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    How to give an input field of type text a few spaces before Text starts

    Hallo,

    I am wondering how does one give a form type of text a few spaces before the text in that field starts?

    Thanks.

    Anoox search engine volunteer

    www.anoox.com

  2. #2
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)

  3. #3
    SitePoint Wizard WorldNews's Avatar
    Join Date
    Nov 2007
    Posts
    1,033
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    No. I mean what is the code to have the start of the Text inside a from Input field to be X pixels from the start of the Input field left side.
    For example look here:
    http://www.anoox.com/

    What I want is to have:
    "I am looking for"
    to start a few pixels from where it is now.

    ThanX


    Quote Originally Posted by EricWatson View Post

    Anoox search engine volunteer

    www.anoox.com

  4. #4
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Give the input padding-left:10px

  5. #5
    SitePoint Wizard WorldNews's Avatar
    Join Date
    Nov 2007
    Posts
    1,033
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    I did.
    That does not work. It does nothing.

    Anoox search engine volunteer

    www.anoox.com

  6. #6
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Just tested yes it does.

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>untitled</title>
    <style>input{padding-left:20px}</style>
    </head>
    <input type="text" name="" value="">
    <body>
    </body>
    </html>

  7. #7
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,478
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    As Eric said it will work if you target the element correctly.
    Code:
    .search_box{padding-left:10px}

  8. #8
    SitePoint Wizard WorldNews's Avatar
    Join Date
    Nov 2007
    Posts
    1,033
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    That Works.
    FYI, I wanted to do it this way:

    <input type="text" name="find" maxlength="40" class="search_box" style="width: 400px; padding-left: 10px;" value="<?php echo $_SESSION['find']; ?>">

    but it was not working that way!
    But it works Ok as you noted when the padding info is entered into the .css file

    ThanX

    Anoox search engine volunteer

    www.anoox.com


Bookmarks

Posting Permissions

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