39 users online (0 members and 39 guests)  

Thread: PhP button


  Results 1 to 7 of 7

Related

  1. Pop-up Button    Forum: HTML Forum
    Replies: 11
  2. PayPal button    Forum: HTML Forum
    Replies: 2
  3. Replies: 3
  4. Button back and next    Forum: Javascript Forum
    Replies: 1
  5. button links    Forum: HTML Forum
    Replies: 1
  1. #1
    Luzer's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Jun 2003
    Posts
    35

    Question PhP button

    how would i make an button and an text field that dont have the outline around it, like this one http://www.airideas.com/php_button.jpg

    and how would i make the textfield go blank when it gets clicked on(for an forum? java script?\

    tnx-luzer
    Last edited by HTML; 03-09-2012 at 07:56 AM.

  2. #2
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    The button is 100% CSS, for the textarea, check out Deans CSS tutorials http://css.somepeople.net/

    Code:
    .cssbtn:link{
    display:inline; display:inline-block;
    width:auto;
    margin:0.1em; padding:2px;
    background-color: #f3f3f3;
    border: 1px solid #000000;
    font-size: 10px;
    font-family: Verdana, arial, geneva, sans-serif;
    color: #000000;
    text-align:center;
    text-decoration: none;
    vertical-align:middle;
    white-space:nowrap;
    cursor:hand; cursor:pointer;	
    }
    .cssbtn:active{
    display:inline; display:inline-block;
    width:auto;
    margin:0.1em; padding:2px;
    background-color: #f3f3f3;
    border: 1px solid #000000;
    font-size: 10px;
    font-family: Verdana, arial, geneva, sans-serif;
    color: #000000;
    text-align:center;
    text-decoration: none;
    vertical-align:middle;
    white-space:nowrap;
    cursor:hand; cursor:pointer;	
    }
    .cssbtn:visited{
    display:inline; display:inline-block;
    width:auto;
    margin:0.1em; padding:2px;
    background-color: #f3f3f3;
    border: 1px solid #000000;
    font-size: 10px;
    font-family: Verdana, arial, geneva, sans-serif;
    color: #000000;
    text-align:center;
    text-decoration: none;
    vertical-align:middle;
    white-space:nowrap;
    cursor:hand; cursor:pointer;	
    }
    .cssbtn:hover {
    display:inline; display:inline-block;
    width:auto;
    margin:0.1em; padding:2px;
    background-color: #000000;
    border: 1px solid #000000;
    font-size: 10px;
    font-family: Verdana, arial, geneva, sans-serif;
    color: #f3f3f3;
    text-align:center;
    text-decoration: none;
    vertical-align:middle;
    white-space:nowrap;
    cursor:hand; cursor:pointer;	
    }
    .cssbtn[class] {
    width:auto;
    min-width:50px;
    }
    Dave

  3. #3
    Luzer's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Jun 2003
    Posts
    35
    Thank you

  4. #4
    Luzer's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Jun 2003
    Posts
    35

    help

    got this
    Code:
    .cssbtn:link{
    display:inline; display:inline-block;
    width:auto;
    margin:0.1em; padding:2px;
    background-color: #f3f3f3;
    border: 1px solid #000000;
    font-size: 10px;
    font-family: Verdana, arial, geneva, sans-serif;
    color: #000000;
    text-align:center;
    text-decoration: none;
    vertical-align:middle;
    white-space:nowrap;
    cursor:hand; cursor:pointer;	
    }
    .cssbtn:active{
    display:inline; display:inline-block;
    width:auto;
    margin:0.1em; padding:2px;
    background-color: #f3f3f3;
    border: 1px solid #000000;
    font-size: 10px;
    font-family: Verdana, arial, geneva, sans-serif;
    color: #000000;
    text-align:center;
    text-decoration: none;
    vertical-align:middle;
    white-space:nowrap;
    cursor:hand; cursor:pointer;	
    }
    .cssbtn:visited{
    display:inline; display:inline-block;
    width:auto;
    margin:0.1em; padding:2px;
    background-color: #f3f3f3;
    border: 1px solid #000000;
    font-size: 10px;
    font-family: Verdana, arial, geneva, sans-serif;
    color: #000000;
    text-align:center;
    text-decoration: none;
    vertical-align:middle;
    white-space:nowrap;
    cursor:hand; cursor:pointer;	
    }
    .cssbtn:hover {
    display:inline; display:inline-block;
    width:auto;
    margin:0.1em; padding:2px;
    background-color: #000000;
    border: 1px solid #000000;
    font-size: 10px;
    font-family: Verdana, arial, geneva, sans-serif;
    color: #f3f3f3;
    text-align:center;
    text-decoration: none;
    vertical-align:middle;
    white-space:nowrap;
    cursor:hand; cursor:pointer;	
    }
    and this
    Code:
    <FORM method=GET action="http://www.google.com/search" target="_blank"><input type=text name=q size=20 maxlength=25 value="Search">  
            <input type=submit name=btnG value="Google">
    how would i add the css to it.
    puting the .cssbtn in front of it(so it loks like this
    Code:
    .cssbtn <FORM method=GET action="http://www.google.com/search" target="_blank"><input type=text name=q size=20 maxlength=25 value="Search">  
            <input type=submit name=btnG value="Google">
    ) and it did not work. im not sure how to put it together(As in have the button be css)
    not to ask to much, but changing the textfield would be ?? in css?
    -very TNA

  5. #5
    Android's Avatar

    Status
    Offline
    Join Date
    Oct 2002
    Location
    I AM CANADIAN
    Posts
    440
    I would start by inserting class="cssbtn" inside the form tag. Or try it inside the input tag.
    Alternatively, you could enclose the entire bit of code within div tags, like:
    Code:
    <div class="cssbtn">
    <FORM method=GET action="http://www.google.com/search" target="_blank"><input type=text name=q size=20 maxlength=25 value="Search">  
            <input type=submit name=btnG value="Google"> 
    </div>
    For the amount of time it would take, I would try all three and see what seems to work best. (Or wait for somebody to tell you about a more correct way I've never dealt with forms, but CSS seems to work like a charm in most circumstances.)

  6. #6
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    The code I gave was for regular links, not submit buttons. You may want to check out Deans CSS tutorials.

    Moving thread to CSS

    Dave

  7. #7
    Luzer's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Jun 2003
    Posts
    35
    my bad in that i guess i should keep on reading. thank you for your help, all of you.



Tags for this Thread