Hello fam this time I decided to see if I could recreate close to the guide we were given and I came up with this. Though it turned out not bad but I know there are still loads of problem here.
The one I can point out is why my dropdown list and submit button won’t reach the end like other input when set to 100% I had to set it to 101% to achieve this, how can I solve this?
If you notice other errors or something I should have done please I would love to know. Thanks in advance.
Below is the link to the project:
Also the autofocus refuses to work, I don’t know if this is an issue with codepen or my code
You may inspect single elements using this CSS: border: 1px solid red;
Anyway, from what I’ve seen on your page it seems that your input elements are overflowing a bit from its container, maybe because of some margin
or padding
, I wouldn’t be too picky about this… I think it’s OK. Maybe more savvy users can come up with an easy fix, I’ll be glad to know too.
I’ve noticed that you are using <br/>
for styling content. You may want to do this via CSS instead, maybe using padding
or margin
. Keep all styling on the CSS side, it’s neater that way.
Also, your CSS background-image:
looks weird to me. You have set as your primary choice a gradient but as a backup background an external image, maybe you meant the other way around? And your gradient is a one color gradient… you may consider just using the color hex, that way I think it’s more clear to anyone reading your code and more optimal and less error prone to the browser.
Anyway this last ones are not actually errors, just personal preference…
I think it’s just CodePen interface that’s preventing the autofocus to work as intended. As you can see there’s an autofocus to the HTML editor already in place.