---
title: Remove black border around input buttons in IE 7
description: >-
  Here I am sharing a bullet proof working solution to remove the ugly black border around IE 7
  input buttons.
url: https://expiredqueues.com/remove-black-border-around-input-buttons-in-ie-7/
date: '2011-09-29T07:05:23.000Z'
image: https://expiredqueues.com/images/og/remove-black-border-around-input-buttons-in-ie-7-569f12fe.jpg
---

Written in September 2011. Much of what it describes has since changed or disappeared; it is kept as a record of how the web used to work, not as advice.

CSS posts css

# How to remove black border around input buttons in IE 7?

29 September 2011 By Adrian 1 min read

Here I am sharing a bullet proof working solution to remove the ugly black border around IE 7 input buttons.

## Problem

The problem is there when a submit button is inside the form element. Click outside the form, form focus is gone, thus the black border is gone. But the form is focused when the page loads so the problem exists there.

![IE7 Black border around input buttons](https://expiredqueues.com/images/opt/problem-320.jpeg)

## Not working solution

Everyone suggests to add outline:none to fix this problem, since outline property is not supported by IE7, I say that this is a non-working solution.

## Bullet proof Solution

Just one property is required to get rid of this black border. Open your reset css file and add these lines:

```css

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

> ### Why in reset css file?
>
> Because the problem is for all buttons in IE 7, since adding this fix in reset.css will fix our problem in entire site.

That's it. All black borders are gone now. The fix is tried/tested against IE 7.

### Result

![Fixed IE7 Black border around input buttons](https://expiredqueues.com/images/opt/solution-320.jpeg)

Better if you put this fix in IE7-CSS file.

### Similar IE 7 Quick Trick

- [How to remove links dotted border in IE7?](https://expiredqueues.com/remove-dotted-border-in-ie7/)

How does that sound to you? Isn't it helpful :).

[Previously Free HTML5/CSS3 WordPress Theme - Clin-UPress](https://expiredqueues.com/free-html5css3-wordpress-theme-clin-upress/) [Next Scrollbar PSD Set](https://expiredqueues.com/scrollbar-psd/)

## Structured data

```json
{
  "@context": "https://schema.org",
  "@type": "BlogPosting",
  "headline": "How to remove black border around input buttons in IE 7?",
  "datePublished": "2011-09-29T07:05:23.000Z",
  "dateModified": "2011-09-29T07:05:23.000Z",
  "author": {
    "@type": "Person",
    "name": "Adrian",
    "url": "https://expiredqueues.com/about/"
  },
  "publisher": {
    "@type": "Person",
    "name": "Adrian"
  },
  "mainEntityOfPage": "https://expiredqueues.com/remove-black-border-around-input-buttons-in-ie-7/",
  "image": "https://expiredqueues.com/images/2011/problem.png",
  "keywords": "posts, css, ie, tips-tricks",
  "articleSection": "CSS"
}
```