Responsive Web Design Projects - Build a Tribute Page

HTML-CSS
1

1…Your img element should have a display of block .
2…Your #image should have a max-width of 100% .
3…Your #image should be centered within its parent.
tried everything but failed. I am getting depressed. help me.
Your code so far

/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <link rel="stylesheet" href="style.css">
</head>


<main id="main">
 <h1 id="title">"Dr Norman Borlaug"</h1>
 <p> the man who saved a billion lives</p>
 
 <div id="img-div">
    <img id="image"
src="C:\Users\HP\Pictures\16435257368460.4769837330786282.jpg" alt="books">
<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>

 <h5 id="tribute-info"> "Borlaug's life and achievement are testimony to the far-reaching contribution that one man's towering intellect, persistence and scientific vision can make to human peace and progress."

-- Indian Prime Minister Manmohan Singh</h5>

<a href="https://tribute-page.freecodecamp.rocks" id="tribute-link" target="_blank"> to know more about
</a>

 </main>

/* file: styles.css */
img {
  display: block;
  max-width: 100%;
  margin: auto;
}
  
}



   **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36

Challenge: Responsive Web Design Projects - Build a Tribute Page

Link to the challenge:

2

The value of href here should be styles.css

1 Like
3

I love you mr … you are the best.
you dont know how depressed I was! you helped me and it worked.
Almighty god bless you my brother.

1 Like
4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.