IE Double Border on Button Problem

Discussion in 'CSS' started by xtreme fever, Feb 9, 2009.

0
  1. #1
    Hello,

    I am using simple CSS to add to a button but, of course, the button in IE has a double border. See attachment.

    background-image: url(search.gif) repeat-x;
    border: 1px solid #CCC;
    height: 25px;
    color: #00F;
    text-decoration: none;
     

    Attached Files:

    xtreme fever, Feb 9, 2009 IP
  2. clicyu

    clicyu Peon

    Messages:
    22
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #2
    try out this:

    first you cut out new image of the button in photoshop (search gif).
    (with text "search" and border, gradient etc.)


    in html replace your button with:

    <input id="search_btn" type="image" value="" src="/images/search.gif" />

    in css:

    input#search_btn {
    width: (exact width of search.gif);
    height: (exact height of search.gif);
    margin: 0 0 0 4px;
    padding: 0;
    border: 0 ;
    }
     
    clicyu, Feb 9, 2009 IP
  3. xtreme fever

    xtreme fever Active Member

    Messages:
    472
    Likes Received:
    8
    Best Answers:
    0
    Trophy Points:
    95
    #3
    no, that's not what i wanted, no image source as a button. i think i might have a solution after searching. it's seems to work ok when i add a span around the button. then have a span input = background: none and border: 0. the span will have the background and border.

    i would have posted sooner but, could not connect to dp for hours.
     
    xtreme fever, Feb 10, 2009 IP