Turning links into buttons
Turning our key content links into visually effective buttons is straightforward. The key classes we'll employ are as follows:
The
btn
class will style a link as a button.The
btn-primary
class will assign a button the color of our primary brand color.The
pull-xs-right
class will float the link to the right, moving it into wider space to make it a more appealing target. Thexs
part of the class name means that it should be applied on every viewport wider than the extra-small breakpoint of 0 pixels. Thepull-md-right
class only floats the elements on viewports wider than 768 px.
Add these classes to the link at the end of each of our three content blocks:
<p><a class="btn btn-primary pull-xs-right" href="#">See our portfolio</a></p>
Save. You should see the following result:
We've made great progress. Our key elements are taking shape.
With our fundamental markup structure in place, we can start working on the finer details. Getting there...