they just keep stacking together, any way to get max 4 in one horizontal lane then from the 5th it comes under the 1st and so on
#HOW TO GET THEM BELOW
desert zephyr
rocky frigate
You can also use /ai to get help from the bot
worn mirage
they just keep stacking together, any way to get max 4 in one horizontal lane th...
can u send code?
rocky frigate
@worn mirage, you just advanced to Active!! 🎉🎉🎉
rocky frigate
maby u can try it that way:
<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
<div class="item">6</div>
</div>```
and then this css:
```.container {
display: flex;
flex-wrap: wrap;
}
.item {
flex: 1 1 25%;
box-sizing: border-box;
padding: 10px;
}```
I hope it work for u :)@worn mirage @rocky frigate i created multiple same divs and it fixed
but i have another problem
simple one
rocky frigate
Yeah tell us
rocky frigate
can u send the code maby?
desert zephyr
yess gimme 1 min
rocky frigate
only the part of html and css from the two things should be enough
rocky frigate
hmm yeah ok wait i think i know why wait give me a sec
desert zephyr
sure bro
rocky frigate
ok if u can change ur code a bit u can try to make another div so it should look like this maby:
<div class="member">
<img src="jtcpfp.jpg" alt="Akat" class="jtcpfp">
<div class="name">Scarface</div>
</div>
<div class="member">
<img src="akatpfp.jpg" alt="Akat" class="akatpfp">
<div class="name">Akat</div>
</div>
<div class="member">
<img src="luoxipfp.jpg" alt="Akat" class="luoxipfp">
<div class="name">Luoxi</div>
</div>
<div class="member">
<img src="xenopfp.jpg" alt="Akat" class="xenopfp">
<div class="name">Xenophros</div>
</div>
<div class="member">
<img src="fudipfp.jpg" alt="Akat" class="fudipfp">
<div class="name">Fudi</div>
</div>
</div>```
In this u dont need for every name a class
in css maby something like this:
.staff {
display: flex;
justify-content: space-evenly;
align-items: center;
margin-top: 300px;
margin-bottom: 100px;
}
.member {
display: flex;
flex-direction: column;
align-items: center;
}
.member img {
width: 100px;
height: 100px;
border-radius: 50%;
border: 1px solid black;
}
.name {
margin-top: 10px;
font-size: 16px;
text-align: center;
}
My results look than like in my screenshot only without the img
desert zephyr
ooo
i think i had problem because i made img tag under the div for name
i'll try and let u know
rocky frigate
yeah
rocky frigate
No problem if u have any new problems feel free to ask :D
@rocky frigate, you just advanced to Active!! 🎉🎉🎉
rocky frigate
where did you learn css from
on udemy i guess i learnd html and css there but i am not the biggest fan of html and css xD
desert zephyr
@rocky frigate I made this
Works fine on my display
But on other's computer it looks like this
My view
rocky frigate
Hmm maby u used something that is not compatible with every browser
I am at school right now. If i find time i will look whats wrong when i am home
desert zephyr
No worries
rocky frigate
No worries
Its bc of ur font. its not fixed. Maby if u have some media querys u have to correct them
rancid smelt
they just keep stacking together, any way to get max 4 in one horizontal lane th...
grid
desert zephyr
@rancid smelt @rocky frigate
iPhone view
Android view
Why is the staff bar different on ios and android
Everything else is fine for both of it
Is it a bug?
Android view is same for all mobile
rocky frigate
Not every browser supports everything
dense quail