RanDumSocks
RanDumSocks

Reputation: 35

image take up no width

I need help making my image take up no width on the HTML. What I mean by this is when you shrink the width size of the window, I don't want the image affecting the horizontal slider. I would think overflow:hidden; would work but the right side of the image takes up space on the HTML document.

Upvotes: 1

Views: 46

Answers (2)

user1925801
user1925801

Reputation: 154

Use a width: 50%; instead of px. Play around with which % value best corresponds to your image width. That way the image will automatically adjust to the browser windows size.

Upvotes: 1

Josh Crozier
Josh Crozier

Reputation: 241208

You could add max-width: 100% to the img element. In doing so, the img will never take up more than 100% of the width of the parent element.

img {
  max-width: 100%;
}

Alternatively, you could also use max-width: 100vw (which is 100% of the browser width's width).

img {
  max-width: 100vw;
}

Upvotes: 1

Related Questions