Hello fellow coders.
Just finished the tribute page below, honest feedback is appreciated.
As I am new to coding, I am not yet familiar with bootstrap. Should CSS or Bootstrap be used in a project like this? Could anyone recommend good study material to learn bootstrap?
Thank you :)))))
Olena
If you’re just getting started, I recommend CSS. Bootstrap and other frameworks have a way of hiding some of the details of CSS from you. It’s better to get to know CSS very well before you start using other tools on top of CSS.
Looks good, mobile responsive and everything works. The only issue for me is the resolution of the photo. Otherwise, it’s exactly what’s been asked of you to do. Congrats!
Hello @OlenaCoding,
Bad value “100%” for attribute “width” on element “img”: Expected a digit but saw “%” instead.
From line 6 to line 6:
<img src="https://timedotcom.files.wordpress.com/2014/04/malala-yousafzai-time-100-feat.jpg?quality=85&w=550" width="100%">
IMG
MDN documentation:
<img>: The Image Embed element - HTML: HyperText Markup Language | MDN
width
The intrinsic width of the image in pixels. In HTML 4, either a percentage or pixels were acceptable values. In HTML5, however, only pixels are acceptable.
<h1 class="text-center">Malala Yousafzai</h1>
<h3 class="text-center"> <em>How One Girl Stood Up for Education and Changed the World</em></h3>
MDN documentation:
<h1>–<h6>: The HTML Section Heading elements - HTML: HyperText Markup Language | MDN
Do not use lower levels to decrease heading font size: use the CSS font-size property instead.Avoid skipping heading levels: always start from
<h1>, next use<h2>and so on.
h2–h6 elements must not be used to markup subheadings, subtitles, alternative titles and taglines unless intended to be the heading for a new section or subsection. Instead use the markup patterns in the §4.13 Common idioms without dedicated elements section of the specification.
Common Idioms
HTML Standard
cheers and happy codding 
Thank you so much for reviewing my work!
I have changed the H3 to H2 and styled it in CSS instead.
I was struggling with image to fit evenly within the figure box, then finally placed it properly by width 100%. What pixel size should be used here?
Regards,
Olena
Thank you for reviewing my work! :))
have you tried with css?
width - CSS: Cascading Style Sheets | MDN
The width CSS property specifies the width of an element. By default, the property defines the width of the content area. If box-sizing is set to border-box, however, it instead determines the width of the border area.
/* <length> values */
width: 300px;
width: 25em;
/* <percentage> value */
width: 75%;
/* Keyword values */
width: 25em border-box;
width: 75% content-box;
width: max-content;
width: min-content;
width: available;
width: fit-content;
width: auto;
/* Global values */
width: inherit;
width: initial;
width: unset;
Cheers and happy coding 
Hello again @Diego_Perez 
Thank you for the above. I tried every value and it does not stretch the image to the whole width of the box… It just leaves it in the middle.
The only value that makes the photo assume the full width of the box is “width=100%”…
ughhhhhh…
“width=100%” is only a problem in HTML5.
You can use “width=100%” in CSS, example:
img {
width:100%;
}
I forked your pen:
I deleted the width attribute (html):
added a css rule:
img {
width:100%;
}
https://codepen.io/erretres/pen/oEYzBQ?editors=1100
In my forked version the photo assume the full width 
.
Cheers and happy coding
I am such a newbie!!! I was formatting “figure” element instead of “img”…
width 100% in CSS worked like a charm!!
Thank you very much!
You’re welcome 
Cheers and happy coding