I am new to this amazing community and having tons of fun so far. I was trying to start the product landing page project today and i feel i have hit a bit of a roadblock. I have the skeleton of the page made at this point mainly looking at the example code and adapting it. I plan to change the css colors and styles of the buttons but i just wanted to get the skeleton down. here is the codepen.
I am having some big issues mainly around the css of the document. i included some red lines as an imgur album so you can see exactly what i am talking about. I am a designer by profession so I am a pretty visual person
imgur album: https://imgur.com/a/xKnBHnN
with my nav area (ingredients, story, menu items) for the life of me i don’t know why its not justifying this flex box to the right. I am sure its something incredibly simple but by looking at the example and other peoples attempts at this project i cant see what it is I am doing wrong here. I was thinking it might have something to do with the fact that its all part of one class and i cant modify this area independently? please help i think this is pointing to something fundamental i dont understand with css.
how can i make the space from the icons to the headers centered and have better space between them? right now my text isnt really controlled and just jumbled together
how do i center the text in this area?
Another alignment issue. Not sure why this also isnt aligning to the right here.
I also want to add a big full bleed image of some grazing llamas in the middle but from the first project I am pretty sure i have the know how to do that from the first project. I think most of my issues stem from my beginners understanding of css. I have tried to do my due diligence and research this but I feel i’m getting a bit stuck.
thanks in advance!