I fail to understand this, I usually use flexbox justify center align center or margin:0 auto, but it will not work. the margin won’t apply to the left. Why have I done this to myself on nye?
I fixed it i guess.
Hi,
Could you share your fix?
yes. could you critique what i have so far, like my markup and the way im doing things? https://codepen.io/lilliongoddess/pen/KKgQrYe
Looks like you’ve solved the issue. 
What you have so far achieves the goal you had but seems incomplete as there’s no place for the baby name.
I’ve no opinion I’m afraid. There’s too many circumstances in how you choose to do things. 
2 Likes
Why have you hidden the overflow on the html element. If you have coded correctly you don’t need to hide the overflow and if you have coded incorrectly then you may have just broken the page for someone.
The height:28em in your generator-wrap is a cause for concern. If a users resizes their text then the text will break out.
The above is an extreme example but if you had simply used min-height:28em (magic number alert) instead then there would be no problem at all. Generally avoid fixed heights on elements that contain text content.
The width:100% on pagewrap is redundant for a block element so should be removed.
.pagewrap {
max-width: 1625px;
/*width: 100%; the default is auto and will allow for padding not to affect width*/
min-height: 60vh;
margin: 0 auto;
}
The min-height:60vh is also a concern as it seems like another magic number and doesn’t really come into play anyway.
3 Likes
i removed that overflow i copy pasted it from another project i did. and thank you! I have one question!! I thought min-height was supposed to be used for every section? somewhere along my learning path things became tangled lol so I really appreciate the help you all have given me.
2 Likes
No you only need min-height when you want a min height.
Most times content will dictate the height without the need for anything special. You can just add a bit of padding around the content so it doesn’t get to near the edge of its container. Sometimes you may want a min-height if you have little or no content or if you are dynamically adding a line or two and don’t want the page to jump.
In responsive design it’s best to let the content control the dimensions and let it be as fluid as possible where the design allows.
1 Like
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.