Three Column Options with Images

Note: the information is filled in here. If you copy and paste this code, you will need to fill in the correct information. All of these options can be seen here, Examples.

Option 1

<div class="column">
    <h2 class="centered">Section Title</h2>
    <p class="centered">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<div class="three-column">
    <div class="column">
        <h2 class="centered uncolor">Section Title</h2>
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
        <p class="centered">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</p>
        <a href="#" class="learnMoreBtn centered">Learn More</a>
    </div>
    <div class="column">
        <h2 class="centered uncolor">Section Title</h2>
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
        <p class="centered">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</p>
        <a href="#" class="learnMoreBtn centered">Learn More</a>
    </div>
    <div class="column bottom-border">
        <h2 class="centered uncolor">Section Title</h2>
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
        <p class="centered">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</p>
        <a href="#" class="learnMoreBtn centered">Learn More</a>
    </div>
</div>

Option 2

<div class="three-column bottom-border">
    <div class="column">
        <h2 class="centered">Section Title</h2>
        <p class="centered"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</strong></p>
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
        <ul>
            <li>Lorem ipsum dolor sit amet</li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li>
            <li>Lorem ipsum dolor sit amet</li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li>
        </ul>
        <a href="#" class="shopNowBtn centered">Shop Now</a>
    </div>
    <div class="column">
        <h2 class="centered">Section Title</h2>
        <p class="centered"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</strong></p>
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
        <ul>
            <li>Lorem ipsum dolor sit amet</li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li>
            <li>Lorem ipsum dolor sit amet</li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li>
        </ul>
        <a href="#" class="shopNowBtn centered">Shop Now</a>
    </div>
    <div class="column">
        <h2 class="centered">Section Title</h2>
        <p class="centered"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</strong></p>
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
        <ul>
            <li>Lorem ipsum dolor sit amet</li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li>
            <li>Lorem ipsum dolor sit amet</li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li>
            <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li>
        </ul>
        <a href="#" class="shopNowBtn centered">Shop Now</a>
    </div>
</div>

Option 3

<div class="column">
    <h2 class="centered">Section Title</h2>
    <p class="centered">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<div class="three-column">
    <div class="column">
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
    </div>
    <div class="column">
        <h3 class="centered uncolor">Section Title</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.</p>
        <a href="#" class="learnMoreBtn centered">Learn More</a>
    </div>
    <div class="column">
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
    </div>
</div>

Option 4

<div class="column top-border">
    <h2 class="centered">Section Title</h2>
</div>
<div class="three-column">
    <div class="column">
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
        <p class="centered">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
    </div>
    <div class="column">
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
        <p class="centered">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
    </div>
    <div class="column">
        <img src="{{media url="wysiwyg/Barrier-Gate-Openers_Home-Thumb.jpg"}}" alt="" />
        <p class="centered">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
    </div>
</div>
<div class="column bottom-border">
    <a href="#" class="readMoreBtn centered">Read More</a>
</div>