I’ve met the criteria and am still messing around with various styling but would love feedback at this point.
Looking good so far. Yes, you still have some styling issues to address.
- Don’t forget to add some padding so that when one of the links in the navbar is clicked the top part doesn’t get overlayed by the navbar.
- The navbar needs to be styled for smaller screens
- If you haven’t already, run the analyze for HTML and CSS to help you clean up some portions of your code
Overall, I really like what you’ve come up with. Good, original thought. Can’t wait to see the finished product.
1 Like
Your widths are responsive, which is good. When you get down to the smallest screen sizes, the navbar is too big and covers the content. You can look at media queries for either:
a) hiding the navbar and replacing it with a drop-down menu (little more advanced)
b) change width/height/font size etc of navbar and navbar elements for smaller screens
The video gets cut off on smallest screens. I’ve never embed video on any of my projects, but with other media, margins:auto and percentage widths usually do the trick for me.
The e-mail box on the bottom could be called “too-responsive”. It becomes so small on small screens that you can’t tell what it is. Input boxes and buttons are kind of the special case for small screens where they can actually benefit more from being larger since people will likely be using their stubby little thumb fingers to navigate.
These are easy to check yourself on codepen. Go to side-view or open up the chrome developer tools and resize your project display to something like 400px.
1 Like