News Home Page with Flexbox and CSS Grid

Community feedback

• Account deleted

  This comment was deleted 8 months ago

  0

  ---

  

  P

  ifaronti•580

  @ifarontiPosted 12 months ago

  @MrSandeepSharma

  Are you sure this comment is for my solution?

  "Aligning the contents to design spec without a figma is kind of difficult unless you want to use position property for most of the content which will be a bad idea" - That's my view of using positioning too much even though there's absolutely nothing relatively wrong with sticking contents in a fixed area of document with CSS position property as long as it allows your layout be how it should be(I spent months on this forum learning positioning from everyone helpful and falling prey to its limitations till I tamed it enough).

  body{
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: black;
  }
  
  @media only screen and (min-width:320px) and (max-width:860px){
      body{
         display: flex;
         justify-content: center;
         align-items: center;
         background-color: #FEFDF9;
      }
  

  I'll like to learn from you, do 3 or two challenges so I can be a student of your brilliance. Thanks but this isn't helpful for me. My issue is an overflow I can't find where it's coming from. I've changed from VW to % and no luck So I used overflow-x: hidden; which causes jerky vertical scroll sometimes. Other than that, I think my solution is very good. Thanks!

  0

  Account deleted

  @ifaronti Hello my dear friend, I didn't wanted to hurt you and I'm really sorry if I said anything wrong 👏👏

  As you said above, first I have to complete some challenges so here is my first solution, hope you like it my solution 😃😃

  0

  

  P

  ifaronti•580

  @ifarontiPosted 12 months ago

  @MrSandeepSharma

  I'm not hurt in anyway just annoyed that a genius won't offer help but point at non-issues instead of showing me a better way.

  From your solution, I can't see how minimal use of position property helped your layout. Also, if you check my CSS, you'll see that some positions relative were declared without specifying units. I always declare position property for my containers. I could use margin instead of position but I prefer to use position if I'm adjusting containers and margin when dealing with contents within containers(I don't strictly follow this rule but I'm trying to). Your solution is aiii. But mine is still better.

  Check my readMe.md file, you'll see that I specifically stated that I'm getting to a stage where I don't have to use position unless absolutely necessary. I tried it with some containers in this solution and it made my transition to mobile layout very fast and super smooth. I'm on the same page as you when it come to position but there's nothing wrong with using position; it just makes responsive layout more time consuming and may cause overflow(margin can too).

  Pick a CSS intensive project, let both of us work on it and compare solutions ? deal?

  0