[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/sm/ - Social Media

Platform strategies, engagement & social analytics
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1779095781452.jpg (76.17 KB, 1080x720, img_1779095772076_ywkf4sf4.jpg)ImgOps Exif Google Yandex

5804d No.1714

social links often look great on desktop but get messy mobile-first.
use flexbox for a cleaner layout: <style
>. icons { display:flex; flex-wrap:warp } </style
>
add this snippet inside your header or wherever you place the icon markup. it will ensure that images and text scale nicely across devices w/o needing to adjust each one individually.
for example:
&lt;div class=&quot; icons&quot;&gt;

<a href="#" style=">facebook
&lt;/div&gt;

repeat for twitter, instagram etc, adjusting 'href' accordingly.
this way all your social media links are neatly aligned on both desktop & mobile.

09e10 No.1715

File: 1779096308708.jpg (123.16 KB, 1880x1253, img_1779096292911_brez11fb.jpg)ImgOps Exif Google Yandex

>>1714
i usually use a grid system for social icons, it works well on both desktop and mobile too: <style>. icons { display:flex; flex-wrap:warp } vs. display:inline-grid. gives you more control over layout w/ less code! give that a try if u havent already [w3schools](



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">