How do i make my header background image fit to screen? | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
0

How do i make my header background image fit to screen?

My webpage is responsive but how do I make any picture I add to it take the size of the screen?

2nd May 2020, 7:23 PM
Iwasam Enya
Iwasam Enya - avatar
4 Answers
0
Use css to make it responsive. Include inside div tag and then make the desired changes in that div. Make sure try on everychange.
2nd May 2020, 7:49 PM
Vishal Srivastava
Vishal Srivastava - avatar
0
height: 100vh; try this in your header tag. You can adjust the vh unit as you like. 100vh is 100% of the viewport or screen size.
2nd May 2020, 8:23 PM
Hassan
Hassan - avatar
0
Thanks Hassan but what I need is the maximum width
2nd May 2020, 10:18 PM
Iwasam Enya
Iwasam Enya - avatar
0
Iwasam Enya I don't fully understand your question. It'll be helpful if you posted your code. background: url('image.jpg') no-repeat center center/cover; Did you add your background property like this? Also, did you reset your margin and padding like this: * { margin: 0; padding: 0 } btw I hope you didn't forget to include <meta name="viewport" content="width=device-width, initial-scale=1.0"> above your css inside head tag.
2nd May 2020, 11:53 PM
Hassan
Hassan - avatar