Reading Notes

All the answers to some of the questions

View project on GitHub

Reading Notes for Day 8 of 201:

Read Learn CSS - Flexbox

  • Flexbox is designed for one-dimensional content. Explain what this means.

Flexbox aligns from right to left, or top to bottom, but not both.

  • Explain the difference between the main axis and cross axis.

The main axis is the one set by your flex direction property, the cross axis is the other direction, so if main is row (across), cross is column and vice versa.

  • How can using certain properties of flexbox negatively impact accessibility?

Reordering items only affects the visual layout, not the logical understanding that is followed by a screen reader, so this can make a site confusing for someone using assistive technology.

Read CSS Layout - Flexbox up to “Flex-Flow Shorthand”

  • What are some advantages of using flexbox over float?

Flexbox doesn’t take elements out of the normal flow of the document so it doesn’t create the same kind of behavioral issues that float can. For example, you can apply a margin to elements in flexbox, and you can control visual elements like background color more precisely.

  • How does this topic connect with your long term goals?

Ideally this information will give me ideas for ways to more precisely control the layout of webpages, and allow me to do it faster and with more predictable outcomes. This will allow me to build prototypes for proof of concepts work on my projects myself if I have to.

Bookmark and Review Learn CSS - Layout

Things I want to know more about

I find controlling the elements on a page very challenging and I want to get better at being able to understand why things behave the way they do. Also I want to finish Flexbox Froggy!

back to Table of Contents