I work out I guess… by Flex Boxin’
Flex Box? Wuz dat?
What is flexbox you may ask? Flexbox allows you to efficiently lay out, align and distribute space in a container when the size (of the screen) is dynamic or unknown! It removes the use of floats, and it won’t collapse with the margins of its contents.
Gimmie Sample Yah?
-webkit-flex-direction: row; /* Safari */
“ This property specifies how flex items are laid out in the flex container, by setting the direction of the flex container’s main axis. They can be laid out in two main directions, like rows horizontally or like columns vertically.”
-webkit-flex-direction: row-reverse; /* Safari */
-webkit-flex-wrap: nowrap; /* Safari */
“ The initial flexbox concept is the container to set its items in one single line. The
flex-wrap property controls if the flex container lay out its items in single or multiple lines, and the direction the new lines are stacked in.”
-webkit-flex-wrap: wrap; /* Safari */
-webkit-justify-content: flex-start; /* Safari */
justify-content property aligns flex items along the main axis of the current line of the flex container. It helps distribute left free space when either all the flex items on a line are inflexible, or are flexible but have reached their maximum size.”
-webkit-justify-content: space-between; /* Safari */
Legit all my ideas… (jk all credit goes to these sites)
This site called scotch.io helped me a lot to understand how each of the properties work by providing examples of what each one did. CSS3 Tricks and W3Schools also helped me define what flexbox is. Hopefully going off from this, I can make the ultimate laggy website ❤