Please take a look at my tribute page, and I would love to hear what you think about it, especially the CSS.
Because, sometime I don’t really have much confident when writing the CSS.
I always thinks “Is it too long? Should it be more briefly?” or “am I did it right?”
Anyone ever feel the same? I would love to hear your thoughts and advice 
4 Likes
Hey @mikyo,
You have done very well with this one.
Your page looks clean, simple and elegant.
You have done ell on responsive front as well.
Good job!! 
1 Like
Its nice, i recommend adding a footer which states image credit, who this webpage was made by, etc.
very nice and clean otherwise
The page is properly responsive and the color scheme is pleasant (and it’s about cats 
). Your css code is well indented and there seems to be no major errors. Great job.
Clean. Well formatted HTML, and perfectly acceptable CSS for a single page.
- I would like to see a few more semantic elements.
<div id="main"> main element
<div id="header"> header element
<div id="tribute-info">, <div id="img-div">, <div id="donate"> section elements
- Further down the road:
A. Look into giving elements classes for styling, which makes them more modular and not so tied to the structure of the HTML.
Summary
// This H1 is tied to a parent element with the id #title
#title h1{
font-family: Oswald, sans-serif;
font-weight: 900;
font-size: 51px;
margin-bottom: 0px;
}
/* This class you can stick on any element, including a h1, to give it the desired style */
.main-title {
font-family: Oswald, sans-serif;
font-weight: 900;
font-size: 51px;
margin-bottom: 0px;
}
B. Look into using relative units for sizing (mainly for padding, margin and font size)
Good job, nicely done.
1 Like
Thanks @aditya_p 
@michaelnicol Ah yes i did credit the images source on html and css comments. But i think i will also credit it on footer, thanks for your suggestions.
@AdityaVT Yes the css has no major errors, I just felt unconfident since the css has so many lines for one page only. Thank for your feedback and high five for cat-lovers 
.
@lasjorg ah okay i think this the reason why my css has so many lines. I don’t use classes for styling because too focused on challenge’s guides who told us to use id attributes.
Yes I will try to learn using relative units Thank you so much for your great guidances
1 Like
Hey mikyo,
Here some tips:
Your first section is 100vh.
The second one is a bit bigger and the third section is a lot smaller.
Try to make a more constant design, meaning you should try to get all sections to the same sizes. Since your second section has 2 different parts, you could also make the last section only 50vh.
Also i would try to create a white filter between section 2 and 3 so the transition looks a lot smoother.
How?
add a new div and position it absolute on your section div. Than you can give it a semi transparent linear-background and voila.
As already mentioned the footer of a page is very important as well. Your footer feels like an unwanted margin. Make it bigger(heigher) and give it another bg-color.
But all in all very good and clean !
If all the images are from Unsplash, then you do not need to.
All photos published on Unsplash can be used for free. You can use them for commercial and noncommercial purposes. You do not need to ask permission from or provide credit to the photographer or Unsplash, although it is appreciated when possible.
Great job on this. Here’s some things I found.
-
The first image needs to be smaller vertically. You can read about the design term “The Fold” here.
-
on your quote “Cats leave paw prints in your heart, forever, and always.”, you forgot the right quote marks.
-
I think that you need to add a Footer section also.
Hope that helps!
Thanks @mblmarlon, I have updated my tribute page, added some padding between section and trying to make a more constant design as you suggested, and for some reason I’ve deleted the footer section 
and @geekysmurf thanks for the great feedback, I’ve updated my header section as I read “The Fold” term you give and added an arrow to guide user to scroll, is that alright?
Such good taste.
Mine is on a butterfly species so now I know I’m not the only one not writing about people.
Looks good. I would put a drop shadow behind the image so you can see the bottom of the pic clearly. Then you can get rid of the superfluous down arrow. I would also lengthen the pic so that the bottom edge is closer to the thank you. Looks better.
Also, FOR ALL CATS, who makes someone happy. drop the S on makes.
thanks for the grammar correction
oh do you mean the background image on header?
I’ve put a drop shadow but since it’s a background image, the drop shadow
is set on div #header.
I think i will try to look for another lengthy cat image and set it in img tag instead of background-image. 
It looks good now. The shadow really helps. Great job.
You could also take this further and add more pages of information.
I think that you should add a header/nav section as well as a footer.
I find it helpful to always expand on projects that you do because it
helps you learn new stuff.