markeya
KPCKevin Powell - Community
•Created by markeya on 2/16/2025 in #front-end
Maintainability and Alignment
I have two concerns for an exercise I’m working on here: https://codepen.io/Mcoding-300/pen/MYWwqQe
note: some borders are included to see spacing/placement*
1) Is there a way I could have more control of how close my paragraph element (product description) is to my h3 element? I would like if there wasn’t so much space between them and that I could adjust it to taste. I don’t think I could even move the h3 anywhere if I tried either.
2) Do you think there’s issue with maintainability in the way this project is coded? Do you believe this could have been written in a more maintainable way? By all means please share your thoughts. I’m trying to improve more everyday.
(For maintainability, I’m aware you could technically nest .product-description inside .product-item but when I tried to, my page didn’t look the way I intended it to. I’m not sure how to make something like that work. If you know, please feel free to share and please keep question 1 in mind if you do).
Also it would be super helpful to me if you could be specific in the wording of your corrections or suggestions.
Also it would be super helpful to me if you could be specific in the wording of your corrections or suggestions.
18 replies
KPCKevin Powell - Community
•Created by markeya on 2/10/2025 in #front-end
Alignment issue: Extra space on the left and right side of a horizontal list when stacked.
https://codepen.io/Mcoding-300/pen/NPWKJMK this preview may show the list vertically but it actually looks horizontal in browsers
I placed a border around a list of (what will be icons when I'm done getting alignment right) to observe how much space the list may have on the left and right sides of itself
1) How do I get this list to stack without the extra space on the left side so that it lines up with the items above it when the screen is reduced for smaller screen sizes?
I've used a media query. I’ve also tried removing all padding and margins from the left of it by setting to 0 as you can see in my code.
2) When my screen is reduced horizontally for smaller screens, I can tell there's a lot of space on the right side of my paragraph. How do I get rid of that?
(I realize part of it might come from space around the list on the right side but I'm not sure how to get rid of that either.
I've tried removing all padding and margins from the right of it by setting to 0 as you can see also).
If you need more info, this is the site I was attempting to emulate and in particular the bottom of its footer https://www2.hm.com/en_us/index.html
It is the footer of the H&M site I shot for, for practicing creating footers (I know everything that I wrote is in the main section. I just didn't know if going straight to the footer without having content in main would have caused any problems later, so I practiced everything in the main).
I tried this to help me learn to create this kind of layout with flexbox and grid + practice with fb and grid in general
11 replies
KPCKevin Powell - Community
•Created by markeya on 2/3/2025 in #os-and-tools
General question about profiles on Github
Is it common for people to have a personal Github and one that they use to show employers?
I’m just starting out with it and I’m not that familiar with it. I just learned that you should use a GitHub account to help you with professional opportunities. Which is why it’s said to be a good thing to use your real name and your picture. However, I see quite a bit of GitHub accounts with profile pictures that aren’t actual people and anonymous usernames
37 replies