Tea Cozy project with....flexboxes?

Get Help CSS
#1

Hi guys

I’m just starting the Tea Cozy CSS project and I’m baffled. I suspect we’re supposed to use flexboxes, as the project comes at the end of a flexbox module, but the design spec lists a bunch of pixel values for layout.

Maybe I’m misunderstanding, but is it not the case that flexboxes and their content can’t be manipulated with pixel values, only values like center, flex-start etc? Also, if we’re supposed to use flexboxes, would we not need a design spec that shows how the page is supposed to look at lower resolutions so we know how to code the flexbox behaviour?

It looks to me like it would be easier to code the page without flexboxes, as the spec gives pixel values and neither says that the page needs to be responsive, nor does it define how it should look on different size screens.

Is this just an artefact of it being a practice exercise for learners, we’re supposed to use flexboxes because we’re told to but the project doesn’t actually need flexboxes and would maybe be easier without?

Yours confusedly
Board7302290096

#2

Hi,
it makes perfect sense to build this project with flexboxes as this would be the best way to create it as a responsive website.
Indeed, it would be a lot easier to create a non responsive website with fixed widths, but it doesn’t make much sense to create a non responsive website as this would hardly be what you will be asked for in the future. Think of your own layout for small devices if there is no specs for it.

You can specify widths for the flexbox layout. There is the property ‘flex-basis’ for this case. I would regard the width numbers in the design specs as a max or approximate width.

You find a good guide of the flexbox model here:
https://css-tricks.com/snippets/css/a-guide-to-flexbox/