This is a solution to the Four card feature section challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- View the optimal layout for the site depending on their device's screen size
- Solution URL: https://github.com/filecc/FM-four-card-feature-section
- Live Site URL: https://filecc.github.io/FM-four-card-feature-section/
- Semantic HTML5 markup
- CSS custom properties
- Mobile-first workflow
- Tailwind CSS - CSS Framework (style)
- Bootstrap - CSS framework (layout)
Fun time using Bootstrap (for layout Grid) and Tailwind (for endless styling with no CSS code)
<header>
<div class="container pt-28 text-center">
<div class="row justify-content-center align-items-center">
<div class="col-10 col-lg-5">
<h1 class="text-[24px] font-extralight">
Reliable, efficient delivery
</h1>
<p class="pt-2 text-[24px]">Powered by Technology</p>
<p class="pt-6 pb-12 text-[15px] font-extralight leading-6">
Our Artificial Intelligence powered tools use millions of project
data points to ensure that your project is successful
</p>
</div>
</div>
</div>
</header>