Can't remove border from img inside of label

Question

This code creates a (what looks like, roughly) 1px solid border that is grey around the img. I set the images border to none, but it doesn't remove the border.

Here's the code :

<label>
  <img style="width:200px;height:200px">
</label>

Answer 1

This is a side effect of your HTML being invalid. Use a validator.

An img element must have a src. Specify what image you want to load and the border goes away.

<label>
  <img  src="https://images.vexels.com/media/users/3/137685/isolated/lists/c078654c8b1501b4c9ee784a330210e5-logo-geometric-polygonal.png" style="width:200px;height:200px">
</label>

If you want a box of certain dimensions without loading an image: Use a div or a different element.

Answer 2

your img tag syntax is wrong. You have:

<label>
   <img style="width:200px;height:200px;">
</label>

but it should be:

<label>
   <img src="myimage.jpg" style="width:200px;height:200px;">
</label>

then the border will disappear! if you just want a white square use:

<label>
   <div style="width:200px; height: 200px;"></div>
</label>

let me know if you need any more clarification!