Search⌘ K

Footer Social Icons Visibility

Explore how to use CSS media queries to toggle visibility of footer social icons and a mobile share button based on viewport width. Understand how to create responsive layouts that optimize user experience by showing social links on desktops and a share button on mobile devices without modifying HTML or using JavaScript.

Problem description

Given an HTML page with two footer sections:

  • <div class="footer-social-icons"> contains multiple social media <a> elements (e.g., Facebook, Twitter, and ...