Desktop if I give the body 100vh. the layout renders nearly perfect. here. however viewing this on a lap top the header is missing? (which viewing 1440px should be fine) but its dragged above the screen?
What other approach should I do here?
Desktop if I give the body 100vh. the layout renders nearly perfect. here. however viewing this on a lap top the header is missing? (which viewing 1440px should be fine) but its dragged above the screen?
What other approach should I do here?
Well, it's not too far off from the design provided. Probably should have added another breakpoint, but it gets the job done. As a first attempt at mobile-first purely with code, it's fine.
What challenges did you encounter, and how did you overcome them?Tried to implement as many different new elements as I could. The stuff didn't give too much trouble, but typography was a real headache. Started with clamp(), but it messed with everything (content size, containers etc), so I just used "manual" measurements and @media. Not happy with that, it means I don't fully grasp how responsive text functions. Will try again in the next one.
What specific areas of your project would you like help with?Honestly, any tips for responsive typography and rem-based containers will be really appreciated. Maybe, I should have had a clamp() with my min and max font sizes, but I still struggle a bit to visualize how calc() works.
Solving this with the style guide. It was indeed helpful
What challenges did you encounter, and how did you overcome them?the container and i was able to overcome it by setting the margin-inine to auto
What specific areas of your project would you like help with?all areas
Great attempt. I think Checking the correct image/font size's (and fonts) and this could be perfect.
Good work. A different way I would approach this would be using flex box to center the div.
Any feedback please?
I really struggle to get this spot on in regards to margin/s and paddings. I even did it with Pixes, for example the the image div has 40px margin but the headline still isn't inline
it was me :)
All sorted. Just needed an increase in fonts
Thank you for your help
Follow me on Twitter as I am about to start the 100 Days of code https://twitter.com/leecockcroft20
Hi Roman, Thank you for your feedback.
Yes I checked your code, I had a few issues using the svg as an "img" so I just embed it and swaped via JS, which obviuously didn't make it responsive.
"As for js part - you should probably insert all the content into html, and only in js aplly filter functionality. "
Usually I do, the only reason I did it this way was due to all the information being in an object, I thought it would be easier running a script (so I'n not repeating myself)
Future projects is it wise to separate, HTML,CSS,JS as much as possible? even if it takes longer?
Also, if I did separate them all, would it have been a very simple, event handler, and using my switch statement to get grab the relevent data tags?
I used this approach as I tried to use the same mentality as using React.
Many thanks for your feed much, it's much appreciated Lee