Ustaw obraz na szerokość tylko dla jednej strony bez paska przewijania HTML - html, css, image, size

Mam następującą stronę:

                <div class="Container100"
style="text-align: center; margin-top: 15px;">
<img
style="width: auto; max-width: 100%; height: auto; text-align: center;"
</img>
</div>

<div class="Container100">
<div class="Card ShadowEffect"
style="text-align: center;">
<div class="ContainerIndent">
Text
</div>
</div>
</div>

Problem jest teraz: Chciałbym zmienić rozmiar obrazu na szerokość, którą stopka i obraz są na jednej stronie i nie ma potrzeby przewijania. Obecnie img jest duży i muszę przewinąć w dół, aby uzyskać stopkę. Jak mogę zmienić rozmiar obrazu do konkretnej szerokości? Mogę zdefiniować szerokość taką jak 500px, ale to nie jest to, czego chcę, ponieważ szerokość / wysokość powinny być tak duże, że obraz i stopka pojawiają się na jednej stronie bez przewijania. Jak mogę to zrobić?

Odpowiedzi:

Ustaw szerokość obrazu na 100% wraz z wysokością i szerokością strony. ustaw także pływak na auto

Wyznacz szerokość i wysokość w% zarówno dla obrazu, jak i stopki.

Na przykład: Jeśli szerokość obrazu wynosi 95% ekranu, ustaw szerokość: 95%; Następnie ustaw stopkę na szerokość: 5%;

Tak powinno być :)