Fotomatic - CSS Stylesheet

Hi There,

I’ve just got to the fotomatic challenge where we need to make the website more responsive. Part of the starter file is a css file which is not linked to the html. Although it is not exactly style of the final products it already includes a lot of styling from the design brief.

Are we supposed to hook up the css file and modify it or write it from scratch? I know that the task at hand is to fix the site but why would they include in the design brief items which were already styled? :confused:

link below:
https://www.codecademy.com/paths/full-stack-engineer-career-path/tracks/fscp-making-a-website-responsive/modules/fecp-learn-css-documentation-and-debugging/informationals/f1-2-c1p1-fotomatic

I believe that correctly linking the CSS file (and any other broken links) is part of the debugging challenge.

A lot of the styling is done but the layout is all out of whack. So it’s fix AND make responsive, really.

I think the broken links were thrown in as a random bonus task to make it feel like a truly broken page.

In retrospect it might’ve actually been easier to rewrite the entire CSS file but I’d already invested too much time.

1 Like

Yeah I think the point of this is to test our problem solving (debugging) ability more than our styling ability. I’m grateful for the provided CSS because doing all those measurements for margins, padding and font-sizes would have been tedious. I could just focus on syntax and logic. This is definiltley the most I’ve ever used Chrome Dev tools.

It felt like cheating using the provided final version, but I was taking forever without it!

1 Like