All comments

• 

  Willian Padilha•40

  @WilliaisSubmitted over 1 year ago

  I'm starting in css and what I felt the most difficulty with was centering the div.

  

  responsive page

  4

  60
  

  Moses Ventura•170

  @Moses2308Posted over 1 year ago

  Hello, Knowing you're starting out with css is helpful context for this project. There are a couple of things to note about your project.

  TLDR

  For further development look into the following topics: CSS BEM, Responsive Design, Relative and absolute units, and Semantic HTML.

  HTML

  1. Like the previous commenter mentioned, you should be using the MAIN element to encapsulate your pages main content. For further development, I would recommend you research the topic of Semantic HTML. You will often be using elements like main, nav, article, main, and footer in your projects.
  2. You shouldn't use Heading elements for size. This is a mistake many people starting can make. Headings should be used for document structure.

  CSS

  1. I can see why you imported a charset in your stylesheet, but its more common to link to the Google Fonts from the HTML. To do this you would copy the <link> code from google fonts and paste it into your HTML's head.
  2. As you develop in your journey, you'll find that using px for certain things becomes less common. I would recommend looking into relative and absolute units. For text it is more common to use rem.
  3. The previous comment referred to never using a height. Generally speaking, you should avoid using height, but if you absolutely have to, then it's recommended to use min-height. The reason for this is that setting a specific height can cause issues with responsiveness.
  4. It isn't an issue yet, as this is a fairly small project, but going forward I would recommend using classes more often. Selecting things by element can cause issues later on. To avoid this we often select things by their classes and then with a combinator we specify further if we need to. I would recommend picking a CSS naming convention to start getting familiar with it. I take inspiration from the BEM naming convention.

  Resources

  https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements https://www.youtube.com/channel/UCJZv4d5rbIKd4QHMPkcABCw https://developers.google.com/fonts/docs/getting_started https://css-tricks.com/bem-101/

  Marked as helpful

  0
• 

  matvei-r•10

  @matvei-rSubmitted over 1 year ago

  Is there a better way to align the elements in the page without needing to to specify the exact amount of pixels it should be spaced?

  

  HTML and CSS solution using flex box

  2

  20
  

  Moses Ventura•170

  @Moses2308Posted over 1 year ago

  There are actually multiple ways to center an element.

  • You can use flex box to center an element in its flex container. To do that you would need to use the justify-content property and the align items property.
  • You can use CSS grid as well to center grid items with place-items : center;
  • You can also use margin auto to center horizontally.

  If you don't want to center the items, it can be helpful to put all the items you do want to align in a container, and use flex box or grid to work on them

  0