MARCUS-IMPERATOR• 90
@MARCUS-IMPERATOR
Submitted
What specific areas of your project would you like help with?
Making a website responsive
Nadir Bousalah
@Medido1
All comments
- Nadir Bousalah• 540
@Medido1
Posted
for the mobile version : in your Html try to the first img ine one div and the rest of the page in a different one so you can apply padding on the content alone and the img would take the whole width of the screen and .container { width: 100vw; } this is before the media queries ! i hope this helps
Marked as helpful
1 - Nadir Bousalah• 540
@Medido1
Submitted
Nadir Bousalah• 540@Medido1
Posted
first i declared an array const month31days = [1, 3, 5, 7, 8, 10, 12]; every number represents a month that is 31days long then in my checkValidity Function i used a condition to check: if the current day > 30 and the current month is not included in the array it will be invalid. else if (!month31days.includes(month) && day > 30 && month > 1 && month < 12) { isValid = false;
0 - Anton Vasilache• 270
@Antonvasilache
Submitted
What are you most proud of, and what would you do differently next time?
- Used grids effectively to create the desired layout
- Used background pattern and configured it as per the design
- Used css classes to differentiate between similar elements with different properties
What challenges did you encounter, and how did you overcome them?
- Took a while to figure out the proper colours for each paragraph.
- Matching the height of the last testimonial with the other ones - did it using a flex container.
- Using the background pattern on the first testimonial - managed to position it using percentage.
- Restyling the testimonial containers for mobile screens - needed resetting the columns to 1, but also the positioning, like so
.testimonial--large-2 { grid-column: 1; }What specific areas of your project would you like help with?
Maybe a more reliable way of styling box shadows.
Nadir Bousalah• 540@Medido1
Posted
great idea to have mulitple break points!! i'll try to apply that to my own challenge
1 - loggerpro• 30
@loggerpro
Submitted
Nadir Bousalah• 540@Medido1
Posted
well done!!
0 - Mohamed Ashraf• 230
@hamody-74
Submitted
What are you most proud of, and what would you do differently next time?
What challenges did you encounter, and how did you overcome them?
What specific areas of your project would you like help with?
Nadir Bousalah• 540@Medido1
Posted
great work !!
Marked as helpful
1 - Michael• 80
@vonsacker
Submitted
What are you most proud of, and what would you do differently next time?
I'm proud of how the result looks like the designs.
What challenges did you encounter, and how did you overcome them?
I had some issues with making the page responsive in the right way. I learned a bit about media queries and how to use them and fixed it.
What specific areas of your project would you like help with?
maybe my code could be more redundant.
Nadir Bousalah• 540@Medido1
Posted
well done!!
1 - Sare• 590
@saseoz
Submitted
Nadir Bousalah• 540@Medido1
Posted
nice work!! you can center the card in the screen and fix the footer at the bottom of the page using flex-box
1 - Prantaneel Pegu• 60
@Prantaneel-Pegu
Submitted
What are you most proud of, and what would you do differently next time?
Making the site responsive on all screens, from desktops to small mobiles. It even supports mobiles in landscape mode. Also, I wrote the code in a very clean and organized way.
What challenges did you encounter, and how did you overcome them?
Not any really.
What specific areas of your project would you like help with?
How can I implement responsive typography page-wide? I would like some links to guides on this topic.
Nadir Bousalah• 540@Medido1
Posted
Great work!! if you look at the design of the active state, you can see that there is an increase in the box shadow of the container when hoverd over, you should consider adding that to your code
0 - Krishna Talekar• 30
@krishnatalekar
Submitted
Nadir Bousalah• 540@Medido1
Posted
Great work!! but i think it's recomanded to write the CSS on it's own seperate file, it offer much better readability than being in the header of the Html document
Marked as helpful
1 - AkashSinha96• 10
@AkashSinha96
Submitted
Nadir Bousalah• 540@Medido1
Posted
Great work !! Try to add the following code to center your card horizontally:
body { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; }
Marked as helpful
1
