Affilaite Product Box Maker

We've updated the new css and html. Please make sure you use the new one. (Dated - 25 Sep 2020)

COPY CSS

/** Top Pick Table CSS*/
.sb_top-box {
  overflow: hidden;
  position: relative;
  max-width: 600px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px 20px 20px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
  margin-bottom: 30px;
  padding: 25px;
}
.sb_top-box h4 {
  position: absolute;
  top: 0px;
  left: 0px;
  font-weight: 900;
  font-size: 15px;
  color: #fff;
  z-index: 1;
  padding: 10px;
  width: min-content;
}
.sb_top-box h4:before {
  background: linear-gradient(45deg, #00e2ec, #1c6be2);
  content: '';
  height: 200px;
  border-radius: 100px;
  width: 200px;
  display: block;
  transform: rotate(45deg);
  position: absolute;
  left: -100px;
  top: -100px;
  z-index: -1;
}
.sb_top-img {
  position: relative;
  width: 50%;
  height: 100%;
  display: block;
  vertical-align: middle;
}
.sb_top-img img {
  max-width: 200px;
  margin: 0 auto;
  display: block;
}
.sb_top-desc {
  width: 50%;
}
.sb_top-desc h3 {
  font-weight: 600;
  font-size: 22px;
  color: #3786e8;
  line-height: 1.2;
}
.sb_top-meta {
  font-weight: 600;
  margin-top: 15px;
}
.sb_top-desc p {
  font-size: 14px;
}
a.sb_top-button {
  display: block;
  background: #177fe4;
  text-align: center;
  padding: 15px 25px;
  margin-bottom: 10px !important;
  color: #fff;
  margin: 0 auto;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}
.sb_top-button:hover {
  background: #2a2a2a;
  color: #fff;
}
.sb_top-pointer {
  position: absolute;
  width: 40px;
  height: 40px;
  overflow: hidden;
  left: 12px;
  bottom: -45px;
}
@media only screen and (max-width: 576px) {
  .sb_top-box {
    width: 100%;
    margin: 0 auto;
    margin-bottom: 30px;
    box-sizing: border-box;
    padding: 20px;
  }
  .sb_top-img {
    margin-top: 10px;
    width: 100%;
  }
  .sb_top-desc {
    width: 100%;
  }
}
/*Top pick table css end*/

Product Name

Product Sub Heading

Product Description

Tag Name

Button Text

Product Link

Product Image Link

Top Pick

Demo Product Title To Be Added Here

Best Product Under 10,000

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dolor libero, placerat ac ipsum a, tempus vehicula nibh. Sed id ante eu metus maximus congue. Aliquam ut lacus ipsum.

Buy on Amazon

Design Inspiration taken from :- Here

Top Pick

Demo Product Title To Be Added Here

Want Your Custom Design or Tools?

Have any new ideas or suggestions for us?

Facing any issue or tools not working?