css - Change header image size

admin2025-06-04  3

I have a header image which looks great on desktop, however, when accessing the site on a mobile device, the image gets cut off in the middle.

How can I make it that the image automatically rescales when accessing the page on a mobile device, so that its width matches the width of the screen.

I have tried adding the following CSS code, but somehow, it doesnt seem to reference to the header image:

header-showcase {
height: auto;
max-width: 100%;
}

Here is the link to the site I am working on:

Thank you very much in advance.

I have a header image which looks great on desktop, however, when accessing the site on a mobile device, the image gets cut off in the middle.

How can I make it that the image automatically rescales when accessing the page on a mobile device, so that its width matches the width of the screen.

I have tried adding the following CSS code, but somehow, it doesnt seem to reference to the header image:

header-showcase {
height: auto;
max-width: 100%;
}

Here is the link to the site I am working on: http://www.mathiasprobst

Thank you very much in advance.

Share Improve this question edited Jan 12, 2019 at 16:59 Mathias Probst asked Jan 6, 2019 at 1:36 Mathias ProbstMathias Probst 11 bronze badge
Add a comment  | 

1 Answer 1

Reset to default 0

Try using these codes:

.header-showcase img {
height: auto;
max-width: 100%;
}
转载请注明原文地址:http://conceptsofalgorithm.com/Algorithm/1749018484a315662.html

最新回复(0)