Hi! I finished project 1 a couple weeks ago then I finished 2, but before I move on to project 3, I wanted feedback from you guys.
I’m having trouble centering my images on my iphone. If I change my image max-width to 100%, the image on mobile looks better, but then it looks way too big on laptop screen.
Be a brutally honest as you can, thanks!
https://codepen.io/mastercoder92/pen/jOVWwvm
Your page looks good @Stampflmail92. Some things to revisit;
- Run your HTML code through the W3C validator.
- There are HTML coding errors you should be aware of and address.
- Since copy/paste from codepen you can ignore the first warning and first two errors.
- Codepen provides validators for HTML, CSS and JS. Click on the chevron in the upper right of each section and then click on the respective ‘Analyze’ link.
- The one for CSS is good. Use it and address the issue(s).
- (The one for HTML misses things which is why I recommend W3C)
- Accessibility is about being accessible to all users. Review the lesson about giving meaningful text to links. For a more thorough explanation read Web Accessibility in Mind.
- “wikipedia page” is not accessible
- Do not use the
<br>element to force line breaks or spacing. That’s what CSS is for.- Reference MDN Docs
- Make your page responsive. Remember, the R in RWD stands for Responsive
- There’s a horizontal scrollbar on smaller screens
To help you visualize how you have your elements defined try adding this as the first line in the CSS editor
* {
border: solid 1px red;
}
You can also move the value: property; pair to any of your selectors to see how they’re set up/defined