reading-notes

Reading 8 - CSS Layout

Source: Learn CSS - Flexbox

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

You can control the vertical or horixontal axis, but not both at the same time like you could if it was a grid.

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

The main axis is whichever one you set with your flex-direction property. This will be either row or column. The cross axis runs in the other direction.

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

Using properties that changes the display to make it different from how the HTML is laid out will negatively impact accesssability. The row-reverse and column-reverse are examples of properties that will do that.

Source: CSS Layout - Flexbox

Q4 What are some advantages of using flexbox over float?

Flexbox makes a lot of layout tasks easier than using floars or positioning. Some of these are:

Additionally, if you resize the browser window or add another article element, the layout works okay.

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

This is helpful in figuring out how to effiiently lay out web pages. Right now, the way that I am used to is not very quick or efficient. It is importand to know multiple strategies for using CSS to quickly know what is going to be the best way to do something.

Things I want to know more about

When would floats be used? What percent of the time is flexbox used?