All solutions

What are you most proud of, and what would you do differently next time?

I'm just super proud that I figured it out. When I saw the design I was like no way I'm solving this one. I have no idea where to even start (with the desktop version that is). I mean I don't know how to position things like that. But I decided to start with the mobile version and just see how far I could get. And I think I did good.

My biggest mistake was almost finishing it, and then leaving it for a few days so when I came to finish it now I was really lost.

What challenges did you encounter, and how did you overcome them?

The biggest challenge was the desktop version. The mobile version was fine. I didn't know how to make the colored top-border but that was easily googled. Positioning the boxes however was something else. My first instinct was to use CSS Grid, but I just couldn't figure it out. So then I tried Flexbox and when I found the property align-self the whole thing just worked itself out so that was nice.

What specific areas of your project would you like help with?

I don't know. I guess I'd like to know if the challenge could have (should have?) been solved with CSS Grid? If that was doable then I'd also like to know how.

I'd also like to know what this means: "All page content should be contained by landmarks". I keep getting this as an error in my Accessibility Report and when I looked it up far as I could tell landmarks are elements that help with the structure and semantics of a page (like header, main, article, section etc.). But when I add those to try and fix the errors it doesn't change anything. So does anyone know what I'm missing?

What are you most proud of, and what would you do differently next time?

I think I'm most proud of the fact that I figured out how to use two different pictures using the picture element. Or no, I'm probably most proud of the fact that I tried a mobile-first workflow and did great. It was like something just clicked and I felt like i temporarily knew what I was doing and where to start and how to move forward. It was just an amazing feeling. Especially since I've been in a place where I've just felt like I don't understand a thing and I'll never be good enough and well you know...

What challenges did you encounter, and how did you overcome them?

The first challenge was actually how to use two different pictures. I think I tried a gazillion different ways before even getting it to work. It was probably not as complicated as I made it out to be, but I just couldn't get it working. I spent a couple of hours on it and ended up using the picture element. Me having set a max-with on the card complicated things a bit but when I increased the max-width on the card in the media query it worked just fine.

What specific areas of your project would you like help with?

I'd like to know if using the picture element was the best way to go or if there are other (more suitable) solutions? How did you do it?

And then just general feedback I guess, anything you can tell me that can help me develop is much appreciated.

What are you most proud of, and what would you do differently next time?

I'm not sure I'm proud of anything in this project. I struggled a lot and I couldn't even get it right. I mean it looks fine I think, but it doesn't look 100% the way it's suppose to in mobile view (the image isn't right) and the table isn't completely right either. But this was my first time working with tables and like I'm guessing that's what it was suppose to be because it says "The table below shows [...]", but I couldn't get it to look just right.

I hadto redo the challenge because the first time I created it desktop-first but that did not pan out so I guess if I was to redo it I would have followed my gut and used a mobile-first workflow to begin with.

What challenges did you encounter, and how did you overcome them?

I encountered a lot and it really made me feel like I'm not good enough and that maybe I should do something else with my time. Sometimes I'm kind of hard on myself and I mean I haven't even been coding for more than 9 months. But the first challenge I encountered was making the site responsive when going from desktop-first so I just commented out all my CSS and did it mobile-first and then reusing the code that still worked.

The second issue was the image in mobile view. No matter what I did I couldn't get it right. I didn't really overcome it. I just decided that I needed to move on. Looking back at it I'm realizing that I could have posted a question on Discord so I think that's what I'll do next time.

The third challenge was the table. And I didn't overcome that either. I mean I think made it look alright but it's not 100% accurate. So same thing here, next time I'll post and ask about it on Discord.

What specific areas of your project would you like help with?

1. The image: What was the HTML and CSS suppose to look like? How could I have made it look the way it does in the design?

2. The table at the bottom of the page: Was it suppose to be a table? I'm thinking yes because of the use of semantic HTML, but is that correct? Could I have styled it differently? Where did I go wrong?

What are you most proud of, and what would you do differently next time?

I'm most proud of the fact that I figured out the whole link-button-hove situation. I thought the links where suppose to be buttons (maybe they were?) but then I couldn't get the hover thing to work. So then I tried wrapping the buttons in anchor-tags which solved the problem but when I tried to validate my code I got a bunch of errors. But eventually I figured out that they were suppose to be links (duh it's called social links profile lol).

What would I do differently? I don't know. Maybe try and finish the challenge in one sitting, because it's difficult working on it and then not doing anythin on it for like a day and then picking it up again. But I have a full-time job and work has been crazy for a few days and sleep is a thing so...

What challenges did you encounter, and how did you overcome them?

The button-problem. Which wasn't really a problem because they were suppose to be links. I'm guessing. I also had a problem with the bottom part of my buttons (before I turned them into links) disappering which I have no idea what that was about or how I solved it.

What specific areas of your project would you like help with?

When are you suppose to use buttons and when are you suppose to use links? I mean links are links and buttons are buttons, but I mean what do you use buttons for? Is it just like submit, send, and stuff like that?

What are you most proud of, and what would you do differently next time?

My second Frontend Mentor Challenge and I'm really proud of the fact that I found a solution to the whole cursor:hover dilemma. I'm not sure using an image was the correct way to go, but it did solve the problem.

If I could do it all over again I would probably try a mobile-first approach. I really need to practice that and a lot of people says that's the way to go. I'm just really new to this whole coding thing and I'm not really sure how to go about it. Like do I just make my screen smaller and start from there?

What challenges did you encounter, and how did you overcome them?

One challenge I encountered was how to make the pointer change when I hovered over the link. I Googled forever and couldn't find a way to change the color of the pointer. So after quite some time I decided to use an image as a pointer. I hadn't done that before but it wasn't all that difficult.

Another challenge I encountered was the font-sizes. In the description it said "The font sizes in this project a slightly smaller in the mobile layout. Find a way to reduce font size for smaller screens without using media queries." I decided to use rem, but I'm not sure that's a solution to the problem. I tried using the calc() function, but I couldn't get it right.

What specific areas of your project would you like help with?

Questions

1. Is using an image as a pointer the "correct" solution to the problem? Are there other ways of solving it? Like is it possible to change the color of the pointer?
2. Is using rems or ems one way to make the font-size smaller on smaller screens? Is that how they work? Or is there another solution?
3. How do you design for mobile-first? Like practically? Do you just make your screen the size of a mobile screen and start coding or is there another, better way of going about it?

What are you most proud of, and what would you do differently next time?

This might sound silly, but i think the thing I'm most proud of is that I didn't give up. I've been in a place for a few weeks where things have been kind of hard and I don't get a lot of enjoyment out of anything. But I keep coding and I'm not giving up. When it comes to the actual code I think what I'm most proud of is centering a div (is that embarrassing?). I'm new to coding and I never seem to be able to figure that out without ChatGPT, but not this time. I figured it out by myself (there was some Googling involved).

I'm not sure if I was suppose to use media queries in this, but it didn't seem like it was needed. But if I was to redo it I'd probably pay more attention to that.

What challenges did you encounter, and how did you overcome them?

Centering a div. But I did not take the easy way out and ChatGPT'd it. Not that there's anything wrong with that, but for me what I've noticed is that when I just AI something it doesn't seem to stick. And I'm new to this so I need to find other solutions as well. I want to really learn this and so I can't just take the easy way out as soon as I get frustrated.

What specific areas of your project would you like help with?

1. I need help with how I get the padding (you know the white frame around the qr-code and text) even all the way around? I just couldn't figure it out. But then again, me and padding needs to get better acquainted with each other. So maybe you could help a gal out.
2. I also really want the question "Was I suppose to use media queries in this challenge?" answered. Because the site worked fine until around 318px in width so I'm thinking no. But what's your opinion?