Please Help! Beginner with CSS Grid Problem

HTML-CSS
1

Hello Everyone! I’m very new to programming in general and I was looking for some help with using the CSS Grid. I’m currently working on the “Product Landing Page” project under the Responsive Web Design curriculum. I have included the link to my project at the top, I think you should be able to see it, (Idk I’m obviously new to using CodePen as well!). I am wanting to have the image in the place that it is in now, but on the right I want the h1 text to appear to its right, and on the top row, with the nav bar being located underneath the h1 text, also to the right of the image. Thank you so much for any help you can provide! I’ve created a grid that should allow for this but it’s not working. Thank you again for your help, I’m sorry if any of this is confusing or if I have misposted!

Regards,

AJ

Edit: my question about Codepen has been answered but I’m still looking for help with the CSS grid!

2

People aren’t able to edit your CodePen, but they can copy it and edit the copy.

1 Like
3

Friendly bump, I would love to be able to fix this when I get home from work today!

4

@eygis, to help you visualize how you have your elements set up add the following universal selector as the first line in the CSS editor

* {
  border: solid 1px red;
}

You can also take that property: value; pair (change color if needed) and put it into any of your selectors to help you see how things are set up.

Hope that helps.

1 Like
5

Thank you for this advice, I’m not able to test a lot with it right now, but I will test with different colors tonight. I’m still not exactly sure what supposed to see with this advice, but I’m getting the sense though that one or more of my elements are interfering with each other, preventing the grid from acting correctly, is this right?

1 Like
6

I was looking up information/reading about the people in the front page of FreeCodeCamp and I found out that one of the guys Shawn Yang moderated the official subreddit of React in Reddit. One of the top post was this website. I immediately bookmarked it and will use in when I do projects if needed.

Sharing this here in case it might be helpful to you,

https://www.euismod.dev/#/

7

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