@renatoalmeida49Submitted about 3 years ago
The close button in the menu has a behavior I don't understand. And I have no idea how to make the letters inside the card keep in the dark, without the filter effect when the hover kicks in.
Андрій Рогов
@Andrii-RohovAll comments
- @Andrii-RohovPosted about 3 years ago
Hi, for the menu problem, i believe it should not be 100% of screen, try to set it (ul {height: 650px}). and for the button problem try and add to class .menu.active { position: absolute;} it will fix youre problems. And about how filter effect, it's complicated)) filter is not best solution, try to solve this problem with pseudo elements or some wrappers, you can check out my solution to see what i mean. But overall great job))👍
Marked as helpful1 - @AvediMusunguSubmitted about 3 years ago
I would appreciate feedback specifically on the following:
- How to maintain the sizes of the various elements whenever i zoom in or out.
@Andrii-RohovPosted about 3 years agoHey, try to delete these props {position: absolute; top: 50px; left: 500px;} from .landing-page and add those instead {margin-top: 100px; margin: auto; min-width: 400px; max-width: 600px;} for start. And try add to body { background-size: cover; or maybe contain;} see how it will affect it
Marked as helpful1 - @elisa-charrierSubmitted about 3 years ago
Hi there! This is my first time facing a Frontend Mentor challenge (loved it!) and my first time using SCSS. I'd appreciate to now if you have any advice for me. What could I improve? What to focus on next time? Thanks to all of you who will answer.
@Andrii-RohovPosted about 3 years agoHi, its a great work for first challenge )) i found only one small improvement, try to set body {height: 100vh}; this way page would stretch to full heigth
Marked as helpful0 - @victoriaodemakinSubmitted over 3 years ago
I'll like any feedback on how to do the purple overlay on the image as I was unable to achieve that. Any other feedback is welcomed as I'm trying to improve my css before diving into js.
@Andrii-RohovPosted over 3 years agohi, add this css rule overlay::after { content: ""; inset: 0; background-color: purple; opacity: 0.5; } its called pseudo elements...look it up))
Marked as helpful0 - @Blanket25Submitted over 3 years ago
I couldn't find a solution that I understood to do the bubble on the desktop version...where should I begin to start understanding how to do it?
@Andrii-RohovPosted over 3 years agoHello, great solution. Try to add to your div id of some sort and then add this css rule ( #(some id here) { possition: relative; } #(some id here)::after { content: ""; position: absolute; bottom: -20px; right: 0; border: 20px solid white; border-bottom-color: white; border-left-color: white; border-left-color: transparent; border-bottom-color: transparent; })
0 - @kofinarteySubmitted over 3 years ago
Hi there, friends. I managed to pull this one off, really proud of myself. However, the slides seem to appear a little too sudden when the button is clicked. I'd be grateful if anyone suggest ways of improving this. Thank you.
@Andrii-RohovPosted over 3 years agohi, nice job.., one thing is to add z-index: 1; to .quote block so the text hovers on top of image, and you could also add some animations
1 - @ProximamusicSubmitted over 3 years ago
hello guys, I have tried my best to make it responsive and make it function properly. I am a new developer, so any suggestion would mean the world to me.
@Andrii-RohovPosted over 3 years agoHi, this is a overall super dope solution. Great stuff!
0 - @MayuraRaneSubmitted over 3 years ago
This is my first frontend mentor challenge. Please let me know how I can improve my code.
@Andrii-RohovPosted over 3 years agoHi there, its a great solution. one improvement, maybe try to set max-width to your container div
Marked as helpful0 - @NateOsSubmitted over 3 years ago
Desktop View was quite easy with bootstrap but then I need feedback how to get the cols to rearrange to suit the mobile view, or perhaps I might just redo the html and css with flexbox instead
@Andrii-RohovPosted over 3 years agoHi there, its good solution, but yeah try to rewrite it, you have too mani divs and wrrapers you only need like three. https://andrii-rohov.github.io/Frontend-Mentor-Challenges-1-/ there is my solution, its not perfect but you can expect it in browser by clicking f12 and try to redo your by using less divs
Marked as helpful0 - @Briancarlo24Submitted over 3 years ago
I have a problem that I can't find an answer to this challenge.
If the screen size went below 300px in mobile. The total with of the page becomes weird and it doesn't stretch to full size. By weird means it becomes smaller and smaller than the current width of the page.
Best way to understand is to check the Live Site and try to check it for yourself.
Hopefully someone can help me with this as I can't figure why.
@Andrii-RohovPosted over 3 years agoHi, can't help you with your problem, but i noticed something you should use css rule ( input:focus { outline: none; } ) to remove blue border
0 - @Allamprabhu2003Submitted over 3 years ago
Any feedbacks and suggestions are welcome!
@Andrii-RohovPosted over 3 years agoHi, when email input empty, error message doesn't work
0 - @heritioSubmitted over 3 years ago
How can i make the pattern in the header with the svg that is given? I have no expirience with svg expect of using it as an image, would like to know how others made the svg pattern and also change the code so that the patterns are random instead of structured. Thanks for feedback
@Andrii-RohovPosted over 3 years agoHi there, in my solution i just place img tag and add src attribute, which points to my svg file
Marked as helpful0
