@AyushKeshwan
Submitted
Here are some parts I find it difficult to code:
- To put icon (overlay image) on main image.
- To align both etherum and clock icon perfectly with their respective tags.
All feedbacks are appreciated, Thank you in advance ^^
@Dany-GitHub
@AyushKeshwan
Submitted
Here are some parts I find it difficult to code:
All feedbacks are appreciated, Thank you in advance ^^
@Dany-GitHub
Posted
You did well in this challenge but their is a small issue in all images src they don't show their perspective images to solve this issue you just need to add . for all images src or delete the /
like this
<img src="./images/icon-ethereum.svg" alt="">
or like this
<img src="images/icon-ethereum.svg" alt="">
and because / alone refer to the root file, and the image is not there it will not load, also try not to leave alt attribute empty, if you find this image will is not important for accessibilty you can add this attribute aria-hidden="true"
to img tag
hope this was helpful, Have a great day and happy coding ✌
@EseAlli
Submitted
I would love some feedback on my solution. Thanks
@Dany-GitHub
Posted
Well Done doing this challenge 🤩
there is a small issue with the toggle button for dark and light mode
I saw js file and figured out where is the problem is coming from
you started with mode = 'dark'
but the first case the mode is light mode not dark mode
I suggest to change the mode variable to light at first then it should work fine.
and another issue for mobile screen, there is no gaps between sections in the overview today part
I suggest to use flex box to add gap between them.
Happy coding and have a great day✌
@Mostafa-ninoo
Submitted
all feedback is welcome
@Dany-GitHub
Posted
it's better to remove the height from the main and center all contents in the body, by using flex or gird, like this
body {
display: flex;
justify-content: center;
align-items: center;
}
I see you used box-sizing in body to reset its properties, you can choose all elements to reset their properties as well like this
* {
box-sizing: border-box;
padding: 0;
margin: 0;
}
the * means assign all those properties to all elements Well done ❤✌, Happy coding
Marked as helpful
@LucasHMelo
Submitted
Any suggestions ? please
How can I Use Grid? i have doubts
@Dany-GitHub
Posted
If you mean grid as a property you can check the document MDN if you mean grid as a whole and you can see a tutorial for it you can check this one from Scrimba Grid Scrimba
This is my first challenge here on Frontend Mentor and I am still new to learning HTML and CSS. Some areas that I would like feedback on and want to improve/become more comfortable with are:
@Dany-GitHub
Posted
Its better to use classes instead of ID here is article for that may be useful DEV as for positioning you can center it with flex box too but you need to give the body
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
since there is no much content on it the height will be auto to cut down the repetition you should use classes for that
Marked as helpful
@Nadine-Green
Submitted
THIS WAS FAIRLY EASY HOWEVER,
I had some problems getting the purple background on the image, any ideas on how to fix this is greatly appreciated :)
@Dany-GitHub
Posted
For the purple on the image, You can do it with mix-blend-mode like this
mix-blend-mode: luminosity;
MDN
@oc-garcia
Submitted
Can someone help me to make my images stay hidden after the card boundaries?
@Dany-GitHub
Posted
You can set the overflow to hidden like that overflow: hidden;
for more info you can see the documents MDN
@DiegoPasaye
Submitted
Hi, this is my try of this SummaryComponent, i can´t fix the background image and the width of the last component "cancel" who have a many idea of the solution?
@Dany-GitHub
Posted
Well Done so far there are some changes you can do
<main></main>
@NadiaFrShLm
Submitted
It looks like my css file is huge, still can't understand how to minimise css proprieties.
@Dany-GitHub
Posted
I suggest to use css variables and u can expand your knowledge more by learning pre processor as sass or scss u will learn things as mixin , functions, extend, partials and more it will make your CSS short and u dont have to repeat so much stuff over and over, Happy coding ✌😊
@Khadijarejjaoui99
Submitted
Hello friends, I have done this challenge using HTML & CSS. I am looking forward to hear your feedback. I appreciate your time :) Thank you!
@Dany-GitHub
Posted
Your solution is amazing 😉, i think your forgot to set the opacity for the the left and right bottom testimonials , otherwise everything looks perfect👌🤍
Marked as helpful
@hannahro15
Submitted
HI, It would be useful to have some feedback on this please. I feel most of it is ok but I had a few problems with the buttons including hover.
@Dany-GitHub
Posted
You did great👌😊 Here are some tips to help you u can set body{ height: 100vh;,display: flex; justify-content: center; align-items: center; } to center everything instead of using margin to center the main element, for the button u can add border: none; to remove those border things , add some padding to make it wider , button { padding: 1rem 2rem } , then for hover u can do this button:hover { background color: (use the color depend on the background of the card ); border: 4px solid white; border-radius: 35px; } change the radius to make it half circle happy coding keep going ✌😊
Marked as helpful
@michaella23
Submitted
I googled up a storm trying to figure out how to pull data from JSON file in vanilla JS. planning to rebuild with React, and I know how to do it there. hopefully code will be DRYer in that version. I'm a little embarrassed of this one!
@Dany-GitHub
Posted
You did an awesome work , just a small tip u can set height: 100vh; to the body to center all the elements , Happy coding
Marked as helpful