Toggle navigation
☰
HTML
CSS
Scripting
Database
<!DOCTYPE html> <title>My Example</title> <style> .fluid-type-container { background-color: #f8f9fa; border: 1px solid #dee2e6; padding: 40px 20px; text-align: center; font-family: sans-serif; border-radius: 8px; } .fluid-heading { margin: 0; color: #0d6efd; /* Min: 1.5rem Preferred: 5vw (5% of the viewport width) Max: 3rem */ font-size: clamp(1.5rem, 5vw, 3rem); } .fluid-text { margin-top: 10px; color: #495057; font-size: 1rem; } </style> <div class="fluid-type-container"> <h2 class="fluid-heading">Fluid Typography</h2> <p class="fluid-text">Resize your browser window to see the heading scale smoothly between 1.5rem and 3rem!</p> </div>