Left Content & Right Image
This sample Feature Box has content on the left with an image on the right. The content is also vertically aligned with the image. Notice, how the image displays at the top on mobile – this is another benefit of using the element.
Right Content & Left Image
This sample Feature Box has content on the right with an image on the left. It’s also using custom widths instead of the default 50/50 width so that the image can display at a larger size and it has a custom background color.
Centered Content & Button
You can also alter the default alignment of the Feature Box heading and content. Plus you can insert a button if you wanted to link out to another page or website. This can be useful for creating call to actions on your site that require a side image.
Rounded Image & Lotta Text
If you just want to add an image next to a paragraph (or more) of text then the Feature Box element is a good solution instead of adding a text block with a floated image. As you can see here we are adding quite a bit of text which will remain to the side of our image.
- You can even create lists if you wanted here.
- Lists can be useful for listing services or features.
- Lists can also be useful for describing things.
- But remember you can add anything you want here.
- This Feature box is also using a fixed 320px width for the image and the text will take up any remaining space.
- We’ve also added a border to this feature box to show you that it’s possible.