How Remove Border Around Image in CSS

How remove border around image in css?

Try this:

img{border:0;}

You can also limitate the scope and only remove border on some images by doing so:

.myClass img{border:0;}

More information about the border css property can by found here.

Edit: Changed border from 0px to 0. As explained in comments, px is redundant for a unit of 0.

CSS Image border Remove

Open up a image editing software. Re-crop / re-save your source image
being rendering from 'background: url('bg.png');' background
property. So, the 'bg.png'.
Another thing you can do if you don't want to do above. Nest another
<div> around your initial .default-img <div> and set the
heights and widths to crop out the white. Make sure to set property
overflow:hidden;
In some rarer cases a white line or (outline) can be induced around
elements as a browser quirk. Test your element across browsers (and
maybe even devices too) to target if it's something browser
specific. Then target that browser and remove. ie. outline { none; }

Hope this helps, g'luck!

Cannot remove borders on images - css

The border is coming from you using an img tag without a src specified and the background set as an image. There are two ways you could fix this:

1) Keep setting the image via the background url, but use a different element (probably a div).

HTML:

<div id="tommy" class= "theGroup player-up">
  <p>Tommy</p>
  <div/>
</div>

CSS:

#tommy div {        
  background: url(http://s32.postimg.org/4fdqh7dxh/tommy200.png);   
  height: 200px;
  width: 200px;
}

2) Keep using an img tag, but set the image via the src attribute instead of the background.

HTML:

<div id="tommy" class= "theGroup player-up">
  <p>Tommy</p>
  <img src="http://s32.postimg.org/4fdqh7dxh/tommy200.png"/>
</div>

CSS:

#tommy img {        
  height: 200px;
  width: 200px;
}

How to remove the border of an image?

Try to modify like this:

.imgCadenas{
  width:  50px;
  height: 50px;
  background: url('/cadenas.png');
  background-repeat: no-repeat;
  background-position: right;
  background-size: 100%;

  border: 0 !important;
  border-style: none !important;
  outline: none !important;

  position: absolute;
  right: 150px;
  top: 5px;
}

EDITED

Your img element missing src attribute,
Try to change img element to div element.

See also:
https://stackoverflow.com/a/22097004/4964262

Remove border around image

It's not a white background, it's the input element's border. Just remove it using CSS by adding the following rule to the .join-us class:

border: none;

It seems that you also need to adjust the height of the button to 106px, so your final class definition will look like this:

.join-us{
    background-image: url("images/join_us.png");
    background-repeat: no-repeat;
    width:181px;
    height: 106px;
    line-height: 106px;
    color: #f7f7f7;
    vertical-align: top;
    margin-top: 10px;
    margin-left: 10px;
    cursor:pointer;
    white-space: nowrap;
    border: none;
}

How can I remove the border around an image without a source?

What I could suggest is in case not having a src="" remove it and you can

img {
    display: none;
}

img[src] {
   display: block;
 }

or if you know like the url contains some special word, like http you can do:

img[src*="http"] {
    display: block;
}

HTML/CSS How to remove a border of a specific Image?

To add or remove a border, you must first pick the picture you want to use. Using a class or an id is a good way to go. Then include it in your CSS.

for example:
declaring class name image1:

<img class="image1" src="product.jpg" alt="" style="width: 200px; height: 200px;">

then call it to your CSS,

.image1{
 /* Manipulating code here */
}

How to remove borders around broken images in webkit?

There is no way to remove it but I wrapped the image in an element that has overflow hidden property in its styles.

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Hide Broken Image border</title>
  <style>
    body{
      background-color:azure;
    }
    .image-container{
      width:100px;
      height:100px;
      overflow:hidden;
      display:block;
      background-color:orange; /*not necessary, just to show the image box, can be added to img*/
    }
    .image-container img{
      margin:-1px;
    }
  </style>
</head>
<body>
  <span class="image-container">
    <img src="path-to-image" alt="I'm Broken :(" width="102" height="102">
  </span>
</body>
</html>

Take a look at this bin
http://jsbin.com/OpAyAZa/1/edit

HTML/CSS Remove Border (or Outline) from Image loaded in SPAN with CSS

Since you are using background-image, change the html element.
You can use a span for example.

JSFIDDLE

https://jsfiddle.net/3vwjc26t/

<div>
<span class="BG"><span class="EU"></span></span>
                </div>

How Remove Border Around Image in CSS