@bahati7Submitted almost 2 years ago
Philemon Bahati
@bahati7All comments
- @keisewarsameSubmitted over 2 years ago
I am open to feedback!
@bahati7Posted over 2 years agoHi @KEISE!
I like your solution:)
Just wrap your ".container" class in a "main" tag for accessibility
Good job
Marked as helpful0 - @JCBolitoSubmitted over 2 years ago
- Were the semantic tags used properly?
- Is the component properly responsive to various device sizes?
- What would you recommend in order to improve my code / output?
@bahati7Posted over 2 years agoHey @Joshua
Your solution looks great! I like It :)
Just wrap the "attribution" in the "footer tag" for accessibility.
Your code is clean
Thanks
1 - @AbecarneSubmitted over 2 years ago
Hi !
I failed in the card dimensions as I didn't succeed in setting a height for it. Then, I should have centered the card in the middle of the screen, but same as the height, it wouldn't apply the "center" property no matter what I changed.
Does anyone knows how can i fix that ?
Thank you :)
@bahati7Posted over 2 years agoHey @anthony
Good job on this! I'd like just to add few tips:
first, to perfectly center the card, this code can help:
.card{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
secondly, try to increase the width of the card on mobile and reduce the h1 size
try until it's perfect
good luck:)
Marked as helpful0 - @yteraiSubmitted over 2 years ago
My main goal for this challenge was to use Flexbox but I feel I didn't make good use of it. So if you find someplace where I could use Flexbox instead of what I am using right now, I'd be happy to hear that! Otherwise, I'd appreciate your feedback/advice :)
@bahati7Posted over 2 years agoHello Yui,
congratulations for this challenge:) just few tips to improve the code:
- add "alt" attributes on img tags for accessibilty;
- wrap your code in a "main" tag instead of div class="content">
- use relative units like %, rem to specify the width of the ".content" class, after that you can add "max-width: 450px";
- you are not obliged to specify the height of the ".content" class
once again good job!!!
0 - @FlowerWineMonkSubmitted over 2 years ago
Hello, guys!
It's truly been a long time since I last uploaded something. Please, tell me if I did something wrong, so that next time I won't make such a mistake.
Yeah, one more thing. Should I learn Bootstrap, Tailwind and SASS or Flexbox and Grid are enough to start learning Javascript
@bahati7Posted over 2 years agoHello there:)
You've done a good job on this; just some tips to improve the code:
- wrap your code in a "main tag"
- interactive controls (button, links) must not be nested like <button class="button"><a href="#" class="hash">Sign Up</a></button>. just use "a" tag.
- try to use media queries for mobile design, there is a problem of responsiveness. @media (max-width:765px){...}
Once again good job!!!
Marked as helpful0 - @OkeraMSubmitted over 2 years ago
I had a lot of trouble with the footer and making my page fully responsive. If you guys have any tips on how I can fix a lot of the issues, feel free to drop some tips.
@bahati7Posted over 2 years agoHello,
- I think this article can be useful: https://css-tricks.com/snippets/css/a-guide-to-flexbox/
- to avoid accessibily uses, try to use semantic html (header, main, footer...)
- try to use relative units like %, rem, em,.. instead of px
- try until it's perfect
Good luck:)
0 - @CuencaGITSubmitted over 2 years ago
this is only a desktop version. If I want to make a mobile version of it too, should I make it first before the desktop?
@bahati7Posted over 2 years agoHello good job on this:)
just some tips to improve the code :
- try to separate your html and css codes in two different files to make it readable.
- wrap your code in the "main" tag instead of using "div class=main" for accessibility issues
- to perfectly center the card and for responsivness, try to use this code in the body tag: " display: flex; align-items: center; flex-direction:column; justify-content: center;"
- please use relative units like rem, em, % instead of px;
- try it until it's perfect
congratulations :)
Marked as helpful1 - @LakorthusSubmitted over 2 years ago
What did you find difficult while building the project?
Positioning right image properly, also i just start learning Js so everything was new for me, but with stackOverFlow and Youtube nothing is impossible.
@bahati7Posted over 2 years agoI really appreciate your work and your solution looks so closer to the original design. Good Job
1 - @KLPython2020Submitted over 2 years ago
Hey guys, any feedback is welcomed. Thanks.
@bahati7Posted over 2 years agoYour solution looks great. I really appreciate it. Just check the mail validation and add button{ cursor: pointer } to your button in the CSS.
Thanks
1 - @Salman-sajibSubmitted over 2 years ago
Check my code and give some feedback.
@bahati7Posted over 2 years agoThe most difficult part in this challenge is the curved sections. I like the way you solved it. Good job. just for mobile screens the only issue is that curved background does'nt fill all the page. please try tofix that.
0 - @BlackpachamameSubmitted over 2 years ago
La verdad es que tome este desafío para ir desoxidándome, hace tiempo que no programo nada y me pareció que era bueno para retomar y repasar lo que se sobre frontend.
@bahati7Posted over 2 years agoHello the overall work is great I like it. Then the next challenge I'll suggest you to work with only html and css. No framework. Anyway Good job on this! Thanks
1
