# Set Image width: 100%, not the Picture tag

**URL:** <https://forum.builder.io/t/set-image-width-100-not-the-picture-tag/112>\
**Category:** Technical Questions\
**Tags:** visual-editor, styling\
**Created:** [June 1, 2020, 7:53am UTC](https://forum.builder.io/t/set-image-width-100-not-the-picture-tag/112 "2020-06-01T07:53:49Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![bull1099](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/bull1099/32/88_2.png) [@bull1099](https://forum.builder.io/u/bull1099)\
**Post date:** [June 1, 2020, 7:53am UTC](https://forum.builder.io/t/set-image-width-100-not-the-picture-tag/112/1 "2020-06-01T07:53:49Z")

</div>

I have been trying to make an image 100% width. The content builder UI sets the \< picture \> tag at width:100% and not the \< img \> tag. As a result there is an overflow. Is it possible to set \< img \> to 100%?

Left image is how the editor looks.  
Right image is how I would like it to look (I edited through Chrome debugger)

 ![Screen Shot 2020-06-01 at 3.50.11 AM](https://us1.discourse-cdn.com/flex020/uploads/builder/original/1X/c0c6b82bf68abd808d495a3dddaa10026228e2a0.png)

---

<div class="post-metadata">

**Author:** ![maddy](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/maddy/32/11_2.png) [@maddy](https://forum.builder.io/u/maddy)\
**Post date:** [June 1, 2020, 4:29pm UTC](https://forum.builder.io/t/set-image-width-100-not-the-picture-tag/112/2 "2020-06-01T16:29:38Z")

</div>

Hi @bull1099! Thanks for reaching out.

Can you send a link to the page this is occurring on? I’d be happy to take a look 😁

---

<div class="post-metadata">

**Author:** ![bull1099](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/bull1099/32/88_2.png) [@bull1099](https://forum.builder.io/u/bull1099)\
**Post date:** [June 1, 2020, 5:30pm UTC](https://forum.builder.io/t/set-image-width-100-not-the-picture-tag/112/3 "2020-06-01T17:30:55Z")

</div>

Here is a content builder link [https://builder.io/content/ab07900056a640809af4e4eef4ceef7c](https://builder.io/content/ab07900056a640809af4e4eef4ceef7c)

Here is a viewable public link [https://wepixeled.now.sh/user/imhsy1h3-z89z86yp-raxuxtse-5cc6rpg0/listing/80aldev1-m4ep0dhq-v4x4di0p-kpfveahh/share](https://wepixeled.now.sh/user/imhsy1h3-z89z86yp-raxuxtse-5cc6rpg0/listing/80aldev1-m4ep0dhq-v4x4di0p-kpfveahh/share)

---

<div class="post-metadata">

**Author:** ![maddy](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/maddy/32/11_2.png) [@maddy](https://forum.builder.io/u/maddy)\
**Post date:** [June 1, 2020, 6:32pm UTC](https://forum.builder.io/t/set-image-width-100-not-the-picture-tag/112/4 "2020-06-01T18:32:27Z")

</div>

Thank you!

If you add an aspect ratio to the image (e.g. 0.5, you can do this in the options tab in advanced settings) it will resolve this issue 😁

Let us know if you have any other questions!

---

<div class="post-metadata">

**Author:** ![bull1099](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/bull1099/32/88_2.png) [@bull1099](https://forum.builder.io/u/bull1099)\
**Post date:** [June 1, 2020, 8:18pm UTC](https://forum.builder.io/t/set-image-width-100-not-the-picture-tag/112/5 "2020-06-01T20:18:14Z")

</div>

Is there another solution? Not all of the images will have the same aspect ratio.

---

<div class="post-metadata">

**Author:** ![maddy](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/maddy/32/11_2.png) [@maddy](https://forum.builder.io/u/maddy)\
**Post date:** [June 1, 2020, 9:04pm UTC](https://forum.builder.io/t/set-image-width-100-not-the-picture-tag/112/6 "2020-06-01T21:04:23Z")

</div>

Another solution is adding custom CSS (e.g.`.some-custom-class img { width: 100% }`). You can add a custom class by navigating to the styles tab and scrolling down to the advanced section. Then you can add custom CSS in the “CSS/JS” section at the bottom of the data tab 😁

![Screen Shot 2020-06-01 at 5.09.13 PM](https://us1.discourse-cdn.com/flex020/uploads/builder/original/1X/1b3dcb9e20a9205ac93c8360cf283376979ca054.png)

Let me know if this works!

---

<div class="post-metadata">

**Author:** ![bull1099](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/bull1099/32/88_2.png) [@bull1099](https://forum.builder.io/u/bull1099)\
**Post date:** [June 1, 2020, 11:02pm UTC](https://forum.builder.io/t/set-image-width-100-not-the-picture-tag/112/7 "2020-06-01T23:02:21Z")

</div>

Awesome. The builder itself is so easy, I forget there is a custom CSS option. That will work, many thanks @maddy