Advice Generator - JavaScript Fetch API

Hi Rishma

As I had your problem before I Know what exactly you meen by asking the question.

In this project it's better to give this settings to body and just put your container inside it.

body{
width:100%;
min-height:100vh;
display:flex;
align-items:center;
justify-content:center;
}

it't better to give body min-height not a fixed height, so if necessary it can stretch vertically.

great job on doing the project, happy coding😊

Hello Rimsha, as always, great job getting the challenge done!

I will try answering your questions:

• The best way in my opinion is using flex in the parent element, this is by far in my opinion the easiest one, for example:

html

<div class='parentEl'>
    <div><p>I need to get centered!</p></div>
</div>

css

.parentEl {
   display: flex;
   justify-content: center;
   align-items: center;
}

Another way around could be using grid:

css

.parentEl {
    display: grid;
    align-content: center;
    justify-items: center;
}

• The item will get centered anyway, if you setup a max-width it will center dinamically until it reach the max-width on resizing, same goes to min-width

Hope my answers help you! if you have any questions, don't hesitate to ask, good solution!