Looking for feedback and have a couple of questions

Code Feedback
1

So I passed all the tests…but I hate how it turned out…I want the logo and header above the navbar… I want the main page background to be fuchsia… and would like different ideas for the email box design…

https://codepen.io/jlee-sisterluv/pen/oNByGbK

2

Hi @ilovemandysue !

I have edited your post.

You will get more responses to your post if you avoid placing links in the title and instead have a title describing what you are looking for from the forum.

Thanks!

3

I was able to look at your project and you have a few errors in your html and css.

Sometimes syntax errors can effect the styling so I would fix those first.

You can run your code through the html validator
and css codepen analyzer.

I would suggest using the header tags and nesting the h1, header image and navbar inside there.

You will need to delete the style tags and fix your h1 end tag.
Then you can target the main tags in your css.

main{
  background:fuchsia;
}

I am not much of a designer but you can research different designs and incorporate some of those styles into your own style.

Like these

Hope that helps!

4

@ilovemandysue, one thing you need to to immediately. It will, and does, affect how your page displays.
Get rid of the <style> tags in the CSS editor.

The <style> tags are only valid within the head element and only in HTML.
The CSS editor in codepen is an external stylesheet. You would never use the <style> tags in an external stylesheet.

You need to remove from your previous pens too and when you do you’ll see what I mean. With the style tag you actually have to add additional, unnecessary CSS code in order to style your page the way you want.

5

Thank you! I am new at all this so I can use all the help I can get!

6

Thanks! I did not Know that!

7

I’m still a bit confused… now it is all messed up…
https://codepen.io/jlee-sisterluv/pen/oNByGbK?editors=1100

8

You still have a few errors in your html that need fixing.

You can’t have two different ids in the same tag.

id="header-img"  id="img-div"

You also can’t have the same id name more than once.

For example, you use these three times.

id="Home" 
id="About"
id="Shop"

Ids have to be unique.
https://www.w3schools.com/html/html_id.asp

For classes, you can use the same name more than once.
https://www.w3schools.com/html/html_classes.asp

Here is what I would do for the header section

The first thing that I noticed was that you are using an #header in your css but you haven’t created that id in your html.
That is why none of those styles are working.

Also you have an error in your #header-img selector with a missing semicolon here

 border-radius:25%

That’s why you don’t see the border radius.

There are a couple of more errors that I didn’t go through.
I would run your code through the html validator and css codepen analyzer.

When it comes to the styling I would just focus on one section on a time.
You might also consider creating a second codepen and isolate the sections you are working.

For example, you can just isolate the header section in a new pen, style it the way you like, fix the errors in the html and css and then copy that code into your final project.

Tackling this in smaller pieces will make everything way more manageable to deal with.

Hope that helps!

9

YES! You have been a tremendous help! Thank You! I also discovered that on the example pen free code camp gives you, I can change the editor view so I can see their code and spot some more errors in my code! Thanks again! Just a side note… if you are interested… I based my landing page on a website I designed through Wix for my music group… here is the website link : https://www.sisterluv.org/

10

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.