Reputation: 35
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
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
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