Will H• 20
@whunter413
Submitted
Feedback welcome! I couldn't get the css to load on GitPages. Any advice for that? Thanks.
Flaviu Dragomir
@FlaviuD94
All comments
- Flaviu Dragomir• 150
@FlaviuD94
Posted
Hi @whunter413,
You could try to place the css file in the same folder as index.html, I think in this way it will run. After you did this, make a commit from your vs code then you need to go to github page change the branch to none, then save. And then you have to deploy again and in few minutes it will be back on updated. Don't forget to modify the src path for linking css file.
Have a good day and enjoy coding!
Marked as helpful
2 - DaftEndev• 80
@DaftEndev
Submitted
Flaviu Dragomir• 150@FlaviuD94
Posted
Hi @DaftEndev, you did a nice work on this project😀. I have some suggetions for you to improve your code: 📝when using img tag don't forget to add alt text. 📝try to use section tag online for sections of your code, like this project could be integrate in a section, and inside use div for block elements and span for inline elements. 📝you can eliminate the code that is not related to your project.
Keep up the good work and enjoy coding!
Marked as helpful
0 - Moh Lutfi Fauzi• 130
@MohLutfiFauzi
Submitted
The most difficult thing in this task is to ensure the distance between the components because we are not given instructions for it
Flaviu Dragomir• 150@FlaviuD94
Posted
Hi, nice to have you around! Welcome to Frontend Mentor Coding community Your solution looks great, you can still do some things to it:
- replace the <h2> containing the main title with <h1> note that this title is the main heading for this page and every page needs one h1 to show which is the most important heading. Use the sequence h1 h2 h3 h4 h5 to show the hierarchy of your titles in the level of importance, never jump a level.
- you can use the <main> instead of using <section>.
- for measurement you can use ruler tool from Photoshop.
I hope it will help you, Enjoy coding!
Marked as helpful
0 - jukry• 50
@tdipowervag
Submitted
Flaviu Dragomir• 150@FlaviuD94
Posted
Hello @tdipowervag,
Welcome to Frontend Mentor community!
Your solution looks awesome and I suggest you add one landmark to your page:
You can use the <main> instead of using <div> for the container element.
More information about Semantic HTML5 Elements I hope this helps and good luck!
Have a nice day and enjoy coding!
0 - Flaviu Dragomir• 150
@FlaviuD94
Submitted
Flaviu Dragomir• 150@FlaviuD94
Posted
I sow that you link is not working. Already made the change that you mention, thank you again. Only one thing I want to mention. The break point to change the images is better at 961px, if you keep it at 650, when you use a phone and turn your phone to landscape screen the style will break.
Wish you all the best!
0 - Victor• 60
@movileanuv
Submitted
- What are some common practices for validating inputs with javascript and outputting error messages?
- How do I reduce the margin bottom of the last input row to the "Confirm button" when one of the inputs is invalid? (according to the design the distance of the input field to the button is slightly smaller then the height of the error message)
Flaviu Dragomir• 150@FlaviuD94
Posted
Hello,
For errors I used a paragraph below the inputs with position: absolute (in this way the content do not moves when it's displayed) and display:none to hide it, after that you can use an IF statemant with a condition, for exemple (cardholdername.length < 10) and change the css display if it's true. In this way you don't need to worry about the margin topic. Take a look at mine solution for this challange. https://www.frontendmentor.io/solutions/clean-css-and-vanila-javascript-rkqzzWVs9t
Have a nice day and enjoy!
1 - Flaviu Dragomir• 150
@FlaviuD94
Submitted
Flaviu Dragomir• 150@FlaviuD94
Posted
Hello,
Thank you for your warm welcoming! I have applied all your suggestions and I much appriciated your feedback. Also I modified h1 font-size to better match with the exemple provided in the challange and I change a bit the padding and the border-radius for a better match.
Wish you all the best!
0
