Help
cancel
Showing results for 
Search instead for 
Did you mean: 
Pilot Lvl 2
Message 1 of 5

The Image is Responsive but it's HUGE!

Hi!

 

I'm building my second project, InspaQuote, and I made the image/poster responsive so it would look good on phones and tablets, etc.

 

So I tried to make it smaller, but then it wouldn't resize. I already searched this up, nothing helps, and I can't fix it. If you need more explanation, please let me know!

 

By the way, I'm using HTML, JavaScript, and CSS for the website.

 

Thank you,

- Zoe K.

4 Replies
Ground Controller Lvl 2
Message 2 of 5

Re: The Image is Responsive but it's HUGE!

can you use :

<picture> <source srcset="small.jpg"> <source media="(min-width: 480px)" srcset="medium.jpg"> <source media="(min-width: 1024px)" srcset="large.jpg"> <img src="fallback.jpg"> </picture>

if you want to use different images, for the different breackpoints.

Pilot Lvl 2
Message 3 of 5

Re: The Image is Responsive but it's HUGE!

@CarmeloMylo  it doesn't work, it deletes the image instead.

Pilot Lvl 1
Message 4 of 5

Re: The Image is Responsive but it's HUGE!

try that:

 

width: 540px;  <!-- you can use % -->
height: auto;

540px is an example 

Pilot Lvl 2
Message 5 of 5

Re: The Image is Responsive but it's HUGE!

@avolpe98that's already done :)

I just needed to make it smaller which, I can't.

This is the InspaQuote home file.