Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Used Bootstrap 4 for Awesome look's and responsive.

Rohit Dubey• 315

@rohitdubey1352

Desktop design screenshot for the Fylo dark theme landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


I developed a landing page with multiple CSS classes.

Community feedback

P
Grace• 27,870

@grace-snow

Posted

Hi, I'd recommend you either have a go at this without bootstrap, or try to only use bootstrap with hardly any css of your own. At the moment it looks to me like your styles will be fighting the bootstrap styles.

In general principles,

  1. build mobile first. That's what bootstrap does, so. You shouldnt have any max-width media queries.

  2. To get everything looking right on mobile, shrink your viewport down small and use bootstrap classes only as needed to get it looking right

  3. Start to enlarge the viewport. As soon as it looks like there's room for the layout to adjust, add breakpoint specific bootstrap classes

  4. Keep doing that until you get to a largest screen screen size

I think you will learn much better if you do some smaller challenges with no bootstrap and then return to this later. Then you will have a much better understanding of what's needed.

But if you are really keen to use bootstrap now, follow the process above.

Best of luck with it

1

Rohit Dubey• 315

@rohitdubey1352

Posted

@grace-snow sure I will follow your instructions and now onwards I only use bootstrap. Yeah, 😆 I think u r right about my style (fighting). Thanks for giving me feedback : )

0
Rohit Dubey• 315

@rohitdubey1352

Posted

@grace-snow Hey, finally I made it into the mobile version check out and give some feedback if u wish : )

0
Teddy K• 30

@dev-ted

Posted

Hi ,rohitdubey1352 .. You almost there you just need to add a few touch ups. I would recommend you use Flexbox or CSS Grid and make use of media queries to make the site more responsive. i would be glad to contribute on this and help you out.

0

Rohit Dubey• 315

@rohitdubey1352

Posted

@dev-ted yeah I try

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord