Join devRant
Do all the things like
++ or -- rants, post your own rants, comment on others' rants and build your customized dev avatar
Sign Up
Pipeless API
From the creators of devRant, Pipeless lets you power real-time personalized recommendations and activity feeds using a simple API
Learn More
-
I totally feel you. A lot of times I have so much freaking trouble vertically centering things, even with all of the different resources online that I've tried! There's gotta be a simple way to overwrite all other stylings to ensure that your vertical centering takes priority. Otherwise this is just going to eat a lot of precious dev time.
-
Flexbox items are sized with flex, which can be set to an arbitrary integer depending on how you want it to size.
Flex 1 with no other siblings with flex still expand that item to its max size. Another item with Flex 1 will share that expanded size equally.
Say one item is Flex 2 and the other is Flex 1, you have a total of 3 slices to share, one get 2/3 and the other 1/3.
That's the most rudimentary explanation I can think of. -
Wrote a blog post on this, hopefully it helps? https://blog.kabir.ml/posts/...
-
@king
Nice website! -
http://sketchingwithcss.com/samplec...
Use vh and vw instead of percent, should work on chrome then. -
@king This is the most straightforward, bullshit-free answer​ I've ever seen. You should feel proud. Damn, your offspring should be proud too!
-
@richo97 welcome to devRant buddy
-
Might I suggest you try http://flexboxfroggy.com
It's a nice little game that teaches you how to do most layouts in flexbox.
I used it to learn to use it myself. -
@hourd that was the best procrastination I've done all day
-
@richo97 devRant is the polar opposite of that.
-
@richo97 You're home now.
-
@king I'll have to try that when I get home. Thanks!
-
@hourd yeah I saw that in my comb prong tab bar last night. That was 1 of the 6 hours.
-
@poster983 did it not help?
-
@hourd
Absolutely, it helped me understand what I was actually doing, and it was a nice break from utter hell. -
@richo97 and your happy place!
-
@hourd whoop I miss read your comment.
It did help me understand, however, the css gods hated me yesterday and nothing worked at all. -
@Kalvin Thank you! 🤗
It's 2017.
Why is vertically centering a div still so stinkin hard?
Yeah yeah ik what you will tell me, "use flexbox".
Well guess what,. I HAVE BEEN TRYING TO FOR THE PAST 6 FUCKING HOURS!
I've gone as far as to copy code from 20+ different websites advertising working solutions. My tab bar looks like the fucking rockey mountains!
My main problem is that flexbox on chrome is not accepting ANY % values.
Now if you'll excuse me, I need to go kill myself. YAY! 🤗
undefined
fml
i hate css