Why the image is not fitting to the screen size , I tried everything I knew .
https://codepen.io/shubham10200/pen/bPaJrN?editors=0100
Image should look like `
https://codepen.io/freeCodeCamp/full/zNqgVx
Where is the problem ? Please help
`
Why the image is not fitting to the screen size , I tried everything I knew .
https://codepen.io/shubham10200/pen/bPaJrN?editors=0100
Image should look like `
https://codepen.io/freeCodeCamp/full/zNqgVx
Where is the problem ? Please help
`
Put the <img>
tag between <center>
tags would make it.
<center>
<section class="heading">
<div id="main">Dr. Norman Borlaug</div>
<div id="description"> The man who saved a billion life </div>
</section>
<div id'img-div=""> <img src="https://c2.staticflickr.com/4/3689/10613180113_fdf7bcd316_b.jpg">
<div id="img-caption"> Dr. Norman Borlaug, third from the left, trains biologists in Mexico on how to increase wheat yields - part of his life-long war on hunger.</div>
</div>
</center>
Deleting the <center>
tags might be better, but I’m not sure.
Problem solved
but still confused is there any alternative other than center tag to do the same ?
Don’t use <center>
it is a deprecated element and you don’t need it. Being able to center elements is vital CSS knowledge.
Here are some different centering techniques
https://codepen.io/lasjorg/pen/aPbLge
css-tricks
Hey Shubham10200, It’s so easy task it’s setting of margin for that ul tags you can apply margin for that ul tag.
Use your creativity and design that project.
Hope this help you. Happy Coding…!
You can use max-width and margin: auto.
ul {
max-width: 560px;
margin: auto;
}
I gave another response in your other thread.