Latest solutions
The News Letter Sign Up
#sass/scssSubmitted 9 days agoI know that I am not supposed to use styling in the JavaScript, so I will need help with how to change that. I plan to come back and fix this later.
My Article Preview Component Solution
Submitted 6 months agoAfter, I thought I was completed. I realized I made a mistake with how the social media icons get displayed when at full screen. I need to go back and fix it later. I do not have the patience to do it now. Is it an easy fix?
NFT Preview Card Component, My Solution
Submitted 8 months agounderstanding how to properly apply display: block, margin: 0 auto
FourCardFeatureSection, My Solution
Submitted 8 months agoI would like more help with flexbox layouts
Latest comments
- @im-victor-mendezSubmitted almost 2 years ago@VincinChristmasPosted 9 days ago
I notice it is incomplete. The error message is not working when not putting the email correctly
0 - @YasminYasmin421Submitted 6 months ago@VincinChristmasPosted 6 months ago
good effort.
it is always a good idea to do the css in a main.css file
to link it to the css yoou can use this line of code:
<link rel="stylesheet" href="main.css">just make sure the index.html and main.css are in the same folder. Otherwise it will not work. Don't give up. Keep trying !
0 - P@clickglueSubmitted 6 months agoWhat are you most proud of, and what would you do differently next time?
Again took more time then I estimated. Many complex details (background color of button changing when pressed but only in desktop version...complicated). Finally did SVG design in HTML code. Fun.
What challenges did you encounter, and how did you overcome them?Keeping focussed and going, also when small details require a lot of time.
What specific areas of your project would you like help with?I have the feeling I make CSS way to complicated. How can I do KISS ?
@VincinChristmasPosted 6 months agoAh....good effort but not quiet write. give me a chance to look at a bit more in detail later. The desktop version doesn't seem to be here and the JavaScript looks tricky. I will dive in and give you feed back soon.
0 - @Fatma-TawfeekSubmitted 7 months agoWhat are you most proud of, and what would you do differently next time?
- Using Grid CSS and make responsive design with it.
- I won't set grid-row-template property I will let the grid items take height from its content
- The challenge I faced was creating a responsive grid layout that adapts well to different screen sizes. In particular, one grid item needed to span two rows on the desktop, while all items had to stack in a single column on mobile, adjusting their heights to fit the content. Additionally, the grid items had varying amounts of content, making it tricky to keep the layout balanced and aesthetically pleasing on all devices.
-I'd appreciate help refining the grid's responsiveness, especially when it comes to ensuring the layout remains visually appealing on a wider range of screen sizes, like large desktops or tablets. I'm also looking for advice on optimising the grid for accessibility, particularly regarding the reading order of the items when they stack in a single column on smaller screens.
-Additionally, I’d like to explore how to implement a fallback for older browsers that don’t fully support CSS Grid, ensuring a seamless user experience across different browsers.
@VincinChristmasPosted 7 months agoYours look perfect, unlike mine. I will take a look at your code and go back and review grid on my own
1 - @LaurentiuMihaiNicutaSubmitted 8 months ago@VincinChristmasPosted 8 months ago
great job
perhaps using a body tag in css is not needed though
0 - @Halima584Submitted 8 months agoWhat are you most proud of, and what would you do differently next time?
At first, I had a hard time trying to get a url, I wasn't getting the github navigation but eventually I persevered and got it. I am so proud of myself for not giving up because I was discouraged and nobody was giving me the answers I want.
What challenges did you encounter, and how did you overcome them?Getting a url on github. I was asking everyone but nobody seemed to get my point. AI came through for me and I am so happy I could go through with this
@VincinChristmasPosted 8 months agoGood job!
It is recommended to use rem instead of px.
There is a small trick that a lot of people use to make sure elements and everything stay in place even when the screen is being zoomed in or out. Maybe something like this:
display: flex; justify-content: center; align-items: center; padding: 0 30px; border-radius: 12px;
also you should always use a CSS reset. Most people on here use this one:
www.joshwcomeau.com/css/custom-css-reset/
0