when i use flexbox this is what happens
what what should i do ?
and help me to better this small challenge in frontendmentor 🙂
![](https://cdn.answeroverflow.com/1117017213715615754/image.png)
13 Replies
when i use flexbox this is what happend
help me pls
Could you paste it in a codepen please?
Also, what exactly is the issue?
when i used the flex the text from the div is pushed down
You're going to have to be a bit more specific
Which text?
removing height: 100% from the img tag seems to fix it
https://codepen.io/vellanki-indeevar/pen/rNQVVbY
this is the codepen
thanks bro
and is there anything that i can improve in it
I'll have to take a look, but first thing that sticks out to me is that you're using
@import
to load the google fonts. Use the <link>
method instead; @import
basically makes it take more time for the webpage to fetch the font style
Read more: https://stackoverflow.com/a/12380004/13264587ok
1. Avoid starting your variables with uppercase characters.
--White
should become --white
2. You generally want to avoid using display: flex
on the body element. It's just a general rule of thumb that people follow, so you don't have to if you think it's easier for you.
3. wholeunit
should become whole-unit
.
4. Use rem
for padding and margins. You don't want to be using px
.i will do that
and i want the attribution p tag to stick on the bottom
how do i do that
https://codepen.io/vince1444/pen/BaGNojK
I changed the html up too
oh thanks bro
i will try to understand it
Let me know if you have any questions
Kevin has videos on all this stuff pretty much, from how flex works, to resets, to how margins behave things like that