CSS Coupon

Developer
Chris Evans
Size
2,434 Kb
Views
10,120
  1. CSS Coupon Previews
  2. CSS Coupon HTML Codes
  3. CSS Coupon CSS Codes

How do I make an css coupon?

What is a css coupon? How do you make a css coupon? This script and codes were developed by Chris Evans on 27 January 2023, Friday.

CSS Coupon Previews
IQ Test

CSS Coupon - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>CSS Coupon</title> <link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="c-coupon"> <h1>Manager's Toolkit + Manager's Insights<br/><strong>10% </strong><br/><a>Apply to Basket</a></h1> <div class="c-coupon__tearaway"></div>
</div>
</body>
</html>

CSS Coupon - Script Codes CSS Codes

html, body { background: #09f; color: #333; font-family: helvetica, sans-serif;
}
.c-coupon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #FFF; padding: 24px 128px 24px 64px; border-radius: 4px; transform-origin: 50% 50%;
}
.c-coupon:before, .c-coupon:after { content: ''; display: block; position: absolute; height: 48px; width: 48px; background: #09f; border-radius: 64px; top: 50%;
}
.c-coupon:before { left: 0; transform: translate(-50%, -50%);
}
.c-coupon:after { right: 0; transform: translate(50%, -50%);
}
.c-coupon__tearaway { display: block; position: absolute; width: 80px; height: 100%; right: 0; top: 0; border-left: 8px dotted #CCC;
}
h1 { font-size: 18px; font-weight: 500;
}
CSS Coupon - Script Codes
CSS Coupon - Script Codes
Home Page Home
Developer Chris Evans
Username anitorious
Uploaded January 27, 2023
Rating 3
Size 2,434 Kb
Views 10,120
Do you need developer help for CSS Coupon?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Chris Evans (anitorious) Script Codes
Name
CSS Drawing - The Great Sandwhich Chef
Dashboard Widgets
Natural Form Editing
CSS Drawing - Life Ring
Button with Progress Indicator
CSS Grid Sandbox
Multiple Off-Canvas Asides
Strengths Profile Dashboard Menu
Loading Indicator - CSS3 Animation
A Pen by Chris Evans
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!