发表新帖
发表新帖

Any way to remove IEs black border around submit button in active forms?

后端 未结
关注
18 1846
南笙
南笙 2020-11-28 22:57

I am implementing a design that uses custom styled submit-buttons. They are quite simply light grey buttons with a slightly darker outer border:

input.button
相关标签:
18条回答
  • 爱一瞬间的悲伤
    2020-11-28 23:18

    With the sliding doors technique, use two spans inside of the button. And eliminate any formatting on the button in your IE override.

    <button><span class="open">Search<span class="close"></span></span></button>
    0 讨论(0)
  • 爱一瞬间的悲伤
    2020-11-28 23:22

    This is going to work:

    input[type=button]
{
       filter:chroma(color=#000000);
}

    This works even with button tag, and eventually you can safely use the background-image css property.

    0 讨论(0)
  • 春和景丽
    2020-11-28 23:23

    I had this problem and solved it with a div around the button, displayed it as a block, and positioned it manually. the margins for buttons in IE and FF was just too unpredictable and there was no way for them both to be happy. My submit button had to be perfectly lined up against the input, so it just wouldnt work without positioning the items as blocks.

    0 讨论(0)
  • 囚心锁ツ
    2020-11-28 23:25

    I know I'm almost 2 years late to the game, but I found another solution (at least for IE7).

    If you add another input type="submit" to your form before any other submit button in the form the problem will go away. Now you just need to hide this new, black-border-absorbing-button.

    This works for me (overflow needs to be "auto"):

    <input type="submit" value="" style="height:0;overflow:auto;position:absolute;left:-9999px;" />

    Note: I am using an HTML5 doctype (<!doctype html>).

    0 讨论(0)
  • 醉话见心
    2020-11-28 23:28

    I've found an answer that works for me on another forum. It removes the unwanted black border in ie6 and ie7. It's probable that some/many of you have not positioned your input="submit" in form tags. Don't overlook this. It worked for me after trying everything else.

    If you are using a submit button, make sure it is within a form and not just a fieldset:

    <form><fieldset><input type="submit"></fieldset></form>
    0 讨论(0)
  • 不知归路
    2020-11-28 23:28

    A hackish solution might be to use markup like this:

    <button><span>Go</span></button>

    and apply your border styles to the span element.

    0 讨论(0)
 看不清?
提交回复
热议问题