Feedback on Portfolio Project + help on 2 annoying things

Code Feedback
1

I’ve got my portfolio project to the best point I can:

But there are two things that - for the life of me - I can’t get right. I’ve googled for three days as I’ve done the final tweaks, hoping for a eureka moment. But, it never came. Here are the things I’m looking for help with:

  1. The margin/padding at the very edge for the cover background photo and the footer. Clearly, I was able to make the background color bleed all the way to the edge for the header, but trying the same techniques for the background photo and footer did not work. I’m guessing it’s a nesting type of problem?? I’ve tried so many different tweaks, and I can’t find where I’m going wrong.

  2. When the width of the screen gets to the low-end of my tablet user size (600px) my portfolio image tiles bleed together before it switched over to a column. But it doesn’t do this with the larger screen size moves up and it goes from two across to three across. Again, I can’t figure out what I did right with one but not the other. Any ideas?

Thanks!

2

Here is the fix for your first part:
You missed body tag along with html at the top.

html,body {
padding: 0px;
margin: 0px;
height: 100%;
font-family: ‘Dosis’, sans-serif;
font-size: 20px;
}

Cheers !!! :slight_smile:

Another Issue: The text on the background overlaps Portfolio text on smaller screen.

2 Likes
3

How ANNOYING that the solution was that simple/How GREAT that the solution was that simple! :joy::sob:
I had the body tag in at one point (clearly not in the correct place, and took it out because I’m not clear on what code Codepen has preloaded. Guess it’s time to actually research that.

Also, thanks for letting me know about the overlapping text. I had that problem earlier and thought I had fixed it. I’m not able to replicate it on my phone or by shrinking down my browser window. Do you know what kind of dimensions or device this happens with? I’m wondering if maybe I should use rem on the text to fix that??