Today I'm starting my little web site project called: "7 Wonders of the World"

Creating project in VS code, making small first steps like main elements head and body.
Honestly it was super easy VS code just autofilled everything for me it's crazy...

Comments

[Rostyslav Harasymiak]

Today I think I did a great job with positioning elements on my page. I added text elements and, at first, I was using a <span> as a parent element with <img> and <p> inside it. I built my entire layout around that structure.

The problem was that I completely forgot about titles.

When I later added <h1> and <h2> elements, my layout broke. That’s when I realized that <span> is not meant to be used as a layout container, especially when working with block-level elements and Flexbox.

Luckily, this is a small project, so fixing it wasn’t a big deal. I replaced the <span> elements with <div> containers and grouped related elements properly. After that, everything started working as expected.

Lesson learned:

Use semantic and structural elements (<div>, <section>, headings) for layout, and reserve <span> for inline text only.
I think it's time to save my progress so I'm goint to commit and push my todays work on githhub.
github.com/oneBucks/link-in-bio.git

[Rostyslav Harasymiak]

Continue working on my page, added pictures, playing with positioning.