Tauseef Ansari• 20
@tausGit
Submitted
hey community, it's my second newbie challenge from frontendmentor :D Do review my code and suggest me improvements for future challenges...
thanks a lot..
just deployed to netlify.. nothing new here
Abrosss
@Abrosss
All comments
- Abrosss• 440
@Abrosss
Posted
Hello! You did a very good job! To split the sections (image and content) equally, i would set the width of both divs inside of the main container to 50%.
.main-container div {width:50%;}
Then remove the img height of 300px and add this instead (so the image fills its container entirely) :
.image { max-width:100%; max-height:100%; object-fit: cover; }
I hope it helps and good luck!
Marked as helpful
1 - Yared• 90
@yaredh30
Submitted
Hey everyone, I can't seem to figure out how to position the image over the container. Any suggestions? Overall I like what I built, the css and Js part was a lil challenging but I got it done.
Abrosss• 440@Abrosss
Posted
Hi! To position the image over the container you can set overflow:visible to the div with the 'container' class
Marked as helpful
1 - Manish Mandal• 650
@manishdevelops
Submitted
hey! community members , I have completed this project. But one problem is there . there should be only one slide visible at a time . but all slides are visible if you scroll you can see, when I am setting overflow:hidden to the main container all slides are getting hide.. if anybody can help me it would be helpful for me ..thank you....
Abrosss• 440@Abrosss
Posted
Hi! Not sure what you mean, cause slides work great for me, but, to hide the scrollbar i would set the height of html, body and main to 100% and then apply overflow:hidden to the main container, and it will look p e r f e c t. Great job!
Marked as helpful
0 - Maikoke• 450
@MaikoCode
Submitted
Let me know your comments and advice !?
Abrosss• 440@Abrosss
Posted
Great job! The only thing that confuses me is the first egg shaped circle with the digit 1 in it :D I would fix it by setting the same width and height to the li element and centering it with flex, for example: display:flex; justify-content:center; width: 53px; height: 53px;
Good luck!
0 - Kaung Zin Hein• 720
@K4UNG
Submitted
I thought styling this would be quiet challenging and logic would be simple, but turns out it was the other way around. I had so much fun writing this and learned a lot about array methods, setInterval and a lot more. I even tried adding some sound effects to it and hopefully it doesn't annoy you. I'd very much love to hear your feedback and suggestions on how I can improve things. Happy Coding!
Abrosss• 440@Abrosss
Posted
So when i press a button it stays pressed till i click another. And i don't know if it should be like this, but i caught myself playing with it pressing all the buttons:D Just want to say it's so satisfying doing this with this ticking sound:D and great job!
0
