Hello Dev Community! 👋 It is Day 4 of my journey toward mastering the MERN stack. For the past three days, I was busy building skeletons with HTML. Today, I finally started bringing those dry structures to life using CSS (Cascading Style Sheets)! It felt amazing to move away from black text on a plain white screen and actually control how things look. I learned that there are three methods to attach styles to HTML, but one is clearly the professional standard: <style> tag in the HTML head..css file and linking it via <link rel="stylesheet"> . I chose this method because it keeps my HTML clean and modular.I mastered the basic anatomy of a CSS rule: Selector { Property: Value; } . I experimented with three primary selectors today: body , h1 ).. ): The most reusable way to style elements (e.g., .btn-primary ).# ): For styling a single, unique element (e.g., #main-header ).I took the semantic "About Me" page and navigation bar that I refactored yesterday and created an external style.css file for it. Today, I didn't worry about complex layouts. Instead, I focused on the basics: <li> ) into an inline layout so they sit horizontally like a real navbar, instead of a vertical bulleted list.Tomorrow, I'm diving into the absolute core of CSS layouts: To the senior engineers: What is your favorite CSS font stack for clean, readable code? To fellow beginners: Did you start with Inline CSS or go straight to External files? My styled code and repository are up to date on GitHub! [Links in the Comments] Keep coding! 🚀
The Difference Between Engineers and Tool Operators