Project 6: Testimonial Slider

CSS Stylist

Builds on these lessons

Step 1 of 2

Project

Relative & Absolute Positioning

Give .testimonial-card position: relative so it becomes a positioning context, then give .quote-mark position: absolute with a top/left offset — it now positions itself relative to the card, not the whole page, letting you pin a big decorative quotation mark exactly where you want it.

🎯 Your Task

Please add the exact code shown in the light gray box below to your editor.Do not delete your previous code, just insert these new lines in the correct place!

.testimonial-card {
  position: relative;
  padding: 32px;
}

.quote-mark {
  position: absolute;
  top: -16px;
  left: 16px;
  font-size: 48px;
  color: #e5e7eb;
}

← Previous Next →