Skip to content
OverviewSolutions
10
Comments
8
Mubaraq Wahab
@mubaraqwahab

All comments

  • Mubaraq Wahab•480
    @mubaraqwahabPosted over 3 years ago

    Impressive!

    0
  • Mubaraq Wahab•480
    @mubaraqwahabPosted about 4 years ago

    Man this is good! Keep up the good work 🎉

    1
  • Mubaraq Wahab•480
    @mubaraqwahabPosted about 4 years ago

    Great! Here's a tip to fix the accessibility issue in your report: Give the input a label and make the label visually hidden.

    0
  • Mubaraq Wahab•480
    @mubaraqwahabPosted about 4 years ago

    It looks like you're missing the background-image behind the phones. The footer should also have a dark blue background colour. Everything else looks good 👍🏾

    0
  • Mariama Alidu•35
    @mgtachenSubmitted about 4 years ago

    I have a lot of problems with CSS.I have been taking a lot of online courses for a while now. In this project it was not responsive on desktop but it was on mobile ,I dont know what is the exact problem.

    Single Price Grid Component

    3
    Mubaraq Wahab•480
    @mubaraqwahabPosted about 4 years ago

    Well done! I have some comments to share:

    1. You have a <div class="bottom"> that contains a <div class="left"> Below .bottom, you have a <div class="right">. The closing tag for .bottom comes before .right. Moving the closing tag below .right (i.e. moving .right into .bottom) should fix the responsiveness issue, I guess.

    2. I suggest you rename your index1.html to just index.html. The design preview here isn't showing the right thing. (It probably expects an index.html file)

    3. A tip: You have a <div class="button">. You could use a <button class="button"> (or a link). I read an article regarding this: When To Use The Button Element

    All the best :)

    1
  • Dare•175
    @fodareSubmitted about 4 years ago

    I had some troubles getting the css "border-radius" to work for the main page. Any tips and solution welcome.

    CSS Assignment

    2
    Mubaraq Wahab•480
    @mubaraqwahabPosted about 4 years ago

    Hey.

    I'm guessing you added border-radius to #Single-Price and it didn't work. It looks like some <div>s inside #Single-Price have their background-colors set and no border-radius, so their sharp edges flow out of #Single-Price. A quick fix would be to add overflow: hidden to #Single-Price.

    Second thing. I noticed you used a <table> to layout the "$29 per month". I've read it's not good (for accessibility, for example). Use a <table> for "tabular" data. In your case, you can use <div>s instead, or <span>s, or something, and style with CSS.

    All the best!

    0
  • Mubaraq Wahab•480
    @mubaraqwahabPosted over 4 years ago

    Well done 👏🏾! Looks almost exactly like the design. The only significant issue I see is that the "Gain access to ..." text should be gray.

    I'm very impressed however. The component's width perfectly matches the design!

    2
  • Mubaraq Wahab•480
    @mubaraqwahabPosted over 4 years ago

    Hey this is good, well done!

    I have two comments:

    1. The avatar seems stretched on desktop. I think giving the .user-avatar__container a width equal to its height should fix it (width: 4rem; perhaps).

    2. Second thing, I think it would be good to have the share button as a <button> not a link. As a link, clicking it scrolls the page back to the top.

    1