Here's my HTML:

```css
.imageURL:active .image_submit_div {
  background-color: #ccc;
  /* has no effect */
}

.image_submit_div:active {
  background-color: #e6e6e6;
}
```

```html
<div class="image_div">
  <label for="id_image" class="image_submit_div">
        <h3>+ add file</h3>
        <input id="id_imageURL" class="imageURL" type="text" name="imageURL" />
    </label>
  <input id="id_image" type="file" name="image" />
</div>
```

The parent div is `image_submit_div`. When you click on it, it changes color:

The child element is `.imageURL`. When this is clicked, I don't want the parent div to change color. When I do the following code, it has no effect:

So how do I prevent the parent div from changing color when I click the child div?

EDIT: Here is a code snippet to give you a better perspective: <https://codepen.io/kingdezz/pen/WOoPgY>