Survey Page SOS!

So I’m doing the Survey Page currently, and so far all my code AFAIK is up to scratch and makes sense, and it passes all the tests for moving forward. However, it currently looks like garbage and I can’t for the life of me work out what to do to get it all formatted to look sensible, I don’t really want to keep throwing padding etc at it until something sticks, I would actually like to know what I’m doing :rofl:
Please have a rummage around and let me know what the best course of action would be. Do I need to work out how to use flexbox, is there some obvious answer that I’m skimming over with my code-addled brain?

P.S. Also, what is the best place to host my code so the finished product is visible online? Obviously CodePen has restrictions, such as only being able to have one project, I was just wondering whether there were similar websites where you can upload your work for others to see the finished product, as it were?

I struggled with the same thing when doing my survey project. I found it helpful to understand that input items are inline by default. You can change an element from inline to block, and also use flexbox or grid to fix the layout. Here’s an article.

Hope this helps you.

1 Like

I’ll have a look, I must confess all the flexbox stuff kinda flew over my head, I mean I got through all the scenarios but knowing why it happens is a whole other kettle of fish.

At @Majopahi, codepen only allows one project for free but an unlimited number of pens. FCC recommends you do pens in codepen (even though they call them projects).

1 Like

That’s what I thought, I was just wondering if there were alternative sites to host pens/projects online with a little more freedom than CodePen.

I’ve had a fiddle with it now, I just can’t get the spacing right and the radio/check buttons look daft when in block but when inline they just don’t adjust? Ideallt I just want it all spaced out a bit more and I’m more or less happy, but if there are any other glaring problems let me know.

And yes, I know it’s silly. :crazy_face:

JSFiddle is one alternative

1 Like

Replying to this post to save making a new one, but I literally can’t work out how to space the radio/check buttons properly and just give the whole page a bit of a spread out. Plus, the text area seems to be forced to one size and I would ideally like it to be variable, so it stays within the borders of the page. Also, it’s on GitHub now, here is the project and here is a preview of the page. Please click the title of the page and have a look at the “translated” page too :joy: