Blue border in IE wont go away - css

Question

I have some pictures with links, and in IE, there is a blue border around them, I have tried everything I have found, this link as well. how to remove blue border around links in IE9?
For some reason I cannot get it to go away.
Thanks in advance for the help.
Its the div.logo one I am trying to fix
body {background-image:url('../images/space1.jpg');
background-repeat: no-repeat center center;
background-position: center;
background-size: cover;
width: 100%;
min-height: 100%;
}
body {color:white;}
a, a:visited {
color:#3399FF; text-decoration:none;}
div.header{
text-align:right;
font-size:200%;
}
div.header1 {
text-align:right;
font-size:125%;
}
div.logo{
margin-top:-40px;
a border:none;
img
text-decoration: none;
border: 0px;
border-style:none;
}
#nav{
width:85%;
height:3%;
font-size: 26px;
font-weight: bold;
border-radius: 8px;
text-align: center;
margin: 0 auto;
position:absolute;
top:100px;
left:120px;
}
#nav ul {
height: auto;
padding: 0px 0px;
margin: 0px;
background-color: #f2f2f2;
border-bottom: 1px solid #ccc;
display: inline-block;
}
#nav li {
display: inline-block;
padding: 20px;
margin-left: auto;
margin-right: auto;
}
#nav a {
text-decoration: none;
color: #3399FF;
padding: 8px 8px 8px 8px;
}
#nav a:hover {
color: #000000;
background-color:#3399FF;
}
nav ul ul {
display: none;
}
nav ul li:hover > ul {
display: block;
}
div.qui {
text-align:center;
font-size:200%;
text-decoration:underline;
}
div.specs {
text-align:center;
font-size:175%;
}
ul.qui {
text-align:center;
font-size:150%;
list-style-type: none;
}
.images {
overflow: hidden;
}
.images img {
float: left;
margin: 0px;
}
div.glams {
text-align: center;
}
.left {
float: left;
margin-left:20%;
padding:10px;
border:3px solid #585858 ;
}
.right {
float: right;
margin-right:20%;
padding:10px;
border:3px solid #585858 ;
}
p.v {
text-align:center;
}
#media only screen and (min-width: 768px) and (max-width: 770px)
and (orientation : portrait) {
div.header{
text-align:right;
font-size:140%;
}
div.header1 {
text-align:right;
font-size:100%;
}
div.logo{
margin-top:-40px;
}
div.logo
img {
height:100px;
width:200px;
}
#nav{
width:100%;
height:3%;
font-size: 100%;
font-weight: bold;
border-radius: 8px;
margin:0;
padding:0;
text-align: center;
margin-top:5%;
margin-left:-14%;
}
#nav ul {
height: auto;
padding: 0px 0px;
margin: 0;
background-color: #f2f2f2;
border-bottom: 1px solid #ccc;
display: inline-block;
}
#nav li {
display: inline
padding: 5px;
margin-left: auto;
margin-right: auto;
}
#nav a {
text-decoration: none;
color:#3399FF;
padding: 8px 8px 8px 8px;
display: inline-block;
}
#nav a:hover {
color: #000000;
background-color: #FFF;
}
li:hover ul {
display: block;
}
nav ul ul {
display: none;
}
nav ul li:hover > ul {
display: block;
}
div.qui {
text-align:center;
font-size:200%;
text-decoration:underline;
margin-top:15%;
}
div.specs {
text-align:center;
font-size:175%;
}
ul.qui {
text-align:center;
font-size:150%;
list-style-type: none;
}
.images {
overflow: hidden;
}
.images img {
float: left;
margin: 0px;
}
div.one {
text-align: center;
}
.left {
float: left;
margin-left:3%;
padding:0px;
border:3px solid #585858 ;
}
.right {
float: right;
margin-right:3%;
padding:0px;
border:3px solid #585858 ;
}
p.v {
text-align:center;
}
div.glams
img {
height:180px;
width: 300px;
}
#media only screen
and (min-device-height : 768px)
and (min-device-width : 1024px)
and (orientation : landscape) {
body { background: green; }
div.header{
text-align:right;
font-size:140%;
}
div.header1 {
text-align:right;
font-size:100%;
}
div.logo{
margin-top:-40px;
}
div.logo
img {
height:80px;
width:150px;
}
#nav{
width:100%;
height:3%;
font-size: 100%;
font-weight: bold;
border-radius: 8px;
margin:0;
padding:0;
text-align: center;
margin-top:5%;
margin-left:-14%;
}
#nav ul {
height: auto;
padding: 0px 0px;
margin: 0;
background-color: #f2f2f2;
border-bottom: 1px solid #ccc;
display: inline-block;
}
#nav li {
display: inline
padding: 5px;
margin-left: auto;
margin-right: auto;
}
#nav a {
text-decoration: none;
color:#3399FF;
padding: 8px 8px 8px 8px;
display: inline-block;
}
#nav a:hover {
color: #000000;
background-color: #FFF;
}
li:hover ul {
display: block;
}
nav ul ul {
display: none;
}
nav ul li:hover > ul {
display: block;
}
div.qui {
text-align:center;
font-size:200%;
text-decoration:underline;
margin-top:15%;
}
div.specs {
text-align:center;
font-size:175%;
}
ul.qui {
text-align:center;
font-size:150%;
list-style-type: none;
}
.images {
overflow: hidden;
}
.images img {
float: left;
margin: 0px;
}
div.one {
text-align: center;
}
.left {
float: left;
margin-left:3%;
padding:0px;
border:3px solid #585858 ;
}
.right {
float: right;
margin-right:3%;
padding:0px;
border:3px solid #585858 ;
}
p.v {
text-align:center;
}
div.glams
img {
height:180px;
width: 300px;
}
}

Answer 1

To make them go away use this:
a > img {
border: 0;
}
This means the image just inside the link should have no border. I had the same issue and its fixed! :) Try it.

Answer 2

a, div {
outline: none;
border: none;
}
outline means the blue border.