stylizing a search form box in CSS?

Discussion in 'CSS' started by Pixelrage, Oct 13, 2007.

  1. #1
    There isn't a single tutorial on the internet that explains this :( I'm looking to edit the look of my search box so that it's more "web 2.0". I want the box to be higher than average, with a much bigger font. Here's an example of what I'm looking for-

    [​IMG]

    any ideas about how this can be done?

    Thanks!
     
    Pixelrage, Oct 13, 2007 IP
  2. jmhyer123

    jmhyer123 Peon

    Messages:
    542
    Likes Received:
    25
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Usually you have to use a picture to do it.

    Check out this link for an example: http://www.dynamiteproxy.com

    If you check out the css and the source code you will see how it's done.

    Let me know if you need anymore help and I'll be glad to help ;)
     
    jmhyer123, Oct 13, 2007 IP
    Pixelrage likes this.
  3. Pixelrage

    Pixelrage Peon

    Messages:
    5,083
    Likes Received:
    128
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Ok, I see it - thanks! I got it now!
     
    Pixelrage, Oct 13, 2007 IP
  4. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    436
    Best Answers:
    0
    Trophy Points:
    0
    #4
    You can either set the form input (be sure to give it a class or ID so that the styles don't affect other inputs to display: block or float: left, then adjust the height, background colors, borders, and text colors as well.

    Just understand that Safari 2 may not like it very much.
     
    Dan Schulz, Oct 13, 2007 IP