Back to top

Affiliate Link: Interested In a Useful Tables For Amazon Products and More? Check Out:

Amalinks Pro

Make Reflective Hero Image

As an Amazon Associate we earn from qualifying purchases made on our website. If you make a purchase through links from this website, we may get a small share of the sale from Amazon and other similar affiliate programs. You can read our complete legal information for more details.

This is a simple quick fix which just jazzes up your homepage without doing anything to make the load any slower, you will want to replace the background I list with your homepage image to have it mirror your image.

This minor set of custom CSS will give your page a more custom look, check out the image below of it on my site as an example.

.featured-categories-wrapper {
    padding: 125px 0px 20px 0;
}

.hero-container {
    width: 500px;
    height: 333px;
    position: relative;
background-position: bottom;
  background-size: cover;
    background: url(https://cdn-5e1e2cc6f911c8096c0b2d4d.closte.com/wp-content/uploads/2019/08/Fast-As-Lightning.jpg);
box-shadow: 0px 50px 70px rgba(0,0,0,0.3),
              0px 10px 10px rgba(0,0,0,0.1);
}

.hero-container::before {
    content: "";
    width: inherit;
    height: 42%;
    position: absolute;
    bottom: -42%;
    background: linear-gradient(to bottom, rgba(255,255,255,0.3),white);
    z-index: 1;
}

.hero-container::after {
    content: "";
    background-image: inherit;
    width: inherit;
    height: 40%;
    position: absolute;
    bottom: -40%;
    transform: scaleY(-1);
    background-position: bottom;
    background-size: cover;
opacity: 0.5;

}

If you find a post helpful and feel like rewarding my effort with the price of a beer, please donate here

About Josh Koop

Hey Everyone! I hope that the short article you read today has taken you from a place of frustration to a place of excited anticipation for your visitors! Please let me know of anything you need for Acabado that can help you achieve your goals! Read More About Me...

My Posts | Website

Josh Koop

Hey Everyone! I hope that the short article you read today has taken you from a place of frustration to a place of excited anticipation for your visitors! Please let me know of anything you need for Acabado that can help you achieve your goals! Read More About Me...

Leave a Reply

Your email address will not be published. Required fields are marked *

Recent Content