Completing Sass for index
In the last section, we left off with starting to do some styling on our jumbotron. There are a few more things we're going to do on the jumbotron, mainly adding margins and making it appear much better than how it looks now:
.jumbotronh1{ margin-top:60px; } .jumbotronp{ margin-bottom:40px; } .jumbotronimg.app-btn{ width:40%; margin-right:30px; } .jumbotronimg.showcase-img{ width:75%; }
As you can see, the code is self-explanatory. As mentioned earlier, it's a trial and error method to see what components of the website look like when it comes to styling. We have added a style to the heading, Capture Life
, the text below it, the Google Play and Apple Store images, and finally the image on the right-hand side of the jumbotron.
Once you make these changes to the jumbotron code, you can inspect the elements and play with the margin and widths you have added by checking and unchecking them to get an idea of how the layout has changed:

You can see how...