FCC Product Landing Page with Bootstrap - Feedback

Hi there, self taught coder here for almost a year. This is one of my first practice projects while learning Bootstrap. I adjusted a little to meet the fcc requirements. I would appreciate any feedback.
Also, any ideas from senior coders why the gradient movement effect on hover that I have created for the first button doesn’t work for the form submit button (input). I had originally created it as a button and the effect was ok but it needs to be input to pass the tests).
https://codepen.io/dennnn/full/KKgMXov

Hey @dannyC,

Good Job on the website, overall that was a high-quality website for being your first project.

This is caused because the CSS that defines the hover is

#textGradient button.btn-start:hover {}

while your other button doesn’t have the class btn-start and is not a button element in the first place, so what you want to do is change the css into including the other input button by using a comma, like this:

#textGradient button.btn-start:hover, input#submit.btn-start:hover {
/* CSS HERE */
}

Hope this helps, and good job again on the website!

Happy Coding!

1 Like

First project using bootstrap framework…not my very first project. My first projects weren’t this polished of course. Thank you for the feedback.

loved the way you used box-shadow, and the pricing column with a background image. looks great.

1 Like

Welcome to the forums @dannyC. Your page looks good. Something to revisit;
Not sure if you noticed but the collapsed menu is not working properly when the screen is minimized. That is, user’s can see the hamburger menu but clicking on it doesn’t toggle it.
That’s because you need to also include jQuery in the JS section. Make sure you put it prior to the twitter bootstrap call.
When I did that on your page it worked correctly.

1 Like

@Roma Yeah you’re right I forgot to add it. That’s because I originally use another editor to create my projects. Thank you for the feedback

1 Like

I do the same thing. Easy to miss/forget.

1 Like