Skip to content
OverviewSolutions
14
Comments
7

Muhammad Muzzammil

@mk-muzzammilFaisalabad Pakistan350 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

View more solutions

Latest comments

  • Muhammad Muzzammil•350
    @mk-muzzammilPosted over 1 year ago

    Some recomendations for you bro please check your design responsivenes again You will not make your desing responsive. Even your desing are breaking at 1000+px.Its because you will not make your images width adjustable to your screen size try to see where your design break where horizontal sidebar coming by this you will come to know thw breakpoints where your desing breaks. Hoep this will helpful to you any query please let me know

    Marked as helpful
    0
  • Muhammad Muzzammil•350
    @mk-muzzammilPosted over 1 year ago

    Yeah a recomendation for you I have seen your code. try to use local variables made it in :root{} and use it on the whole stylesheet. Another recomendation is you set buttons using position absolute try it to do with flex using align-self:baseline .if you are using flex property then try to position it using relative units like vh,% it is more helpful to you in position elements more accurately even in responsive desings .Main Fault i have found in your project see your responsive mobile preview because you set height 100vh cards are not showing correctly it will go beshind the screen try not to set the height in these cases. hope you will like some recomendations any other query let me know.

    Marked as helpful
    1
  • Muhammad Muzzammil•350
    @mk-muzzammilPosted over 1 year ago

    yeah go for it and make projects with display:grid property u can make the same project also with grid use grid-template-Columns:1fr after setting display grid .

    Marked as helpful
    1
  • Muhammad Muzzammil•350
    @mk-muzzammilPosted over 1 year ago

    yeah I have found your mistake u are lets talk about one section .In first section sedan section u are trying to use flex properties without using display flex and it effects your positioning of button because you can use align-self :baseline only when your parent element which is your section in this case should be flex but in this case parent element is display block due to which you will not position your button . Do these Changes to correct it : .sedans{display:flex;flex-firection:column;} .button:remove display block and margin-left:20px and use align-self:baseline instead of align-self:first baseline. Hope so this comment will help you in understanding your issue.

    Marked as helpful
    0
  • Muhammad Muzzammil•350
    @mk-muzzammilPosted over 1 year ago

    A lot of improvement you need to adopt : 1 - Firstly main thing you need to do is using media queries to make your website responsive and firstly see the challenge carefully before starting because frontend mentor has provided you also the mobile design not only desktop design so use media queries to do this.

    2- Make seperate style.css file and write css code outside the html file its the best practise you should follow

    3- Dont use inline css dont write css inside the tags its not a good experience

    4- Make local variables in :root and then use it in your css code

                                                         Hope so its helpful for you
    Marked as helpful
    0
  • Muhammad Muzzammil•350
    @mk-muzzammilPosted over 1 year ago

    Overall you did well try to do some changings. Try to just fix the width using absolute units like px but not height keep your height default and when you have done this now give their children containers max-width 100% not height 100% by this You will better your code for more review my code of order-Summary challenge i hope it helps you alot

    0
View more comments