Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • @atekron

    Posted

    it depends, for short - rem will respect font size settings of user browser, default 16px, em size is relative to parent a container, can be useful for some cases, and px is just a pixel, kind of constant size, generally I try to stick to rem, becase it's very predictable, in contrast to em

    0
  • @mostafa-gouda

    Submitted

    I'd love to get some feedback about my CSS class naming and whether I am following best practices or not

    @atekron

    Posted

    Hi, you can take a look at this https://en.bem.info/methodology/ , useful for controlling complexity and widely used in industry

    0
  • @Raj-k-Jha

    Submitted

    hi, I am facing difficulties in making the cards suitable for the desktop version. please suggest some alternates or solutions.

    @atekron

    Posted

    Hi, I think you need to read this - https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Introduction , it's not very long but it give you a good overview of modern css layout, and yeah for most cases you should not use float for that :)

    0
  • @atekron

    Posted

    add update() call to your checkbox oninput to update price on checkbox toogle, to fix background use this: {background-position: top left; background-size: 100vw 50%;} on desktop assign text-align: left; to your .list-about

    0
  • @AngryMorrocoy

    Submitted

    I want some feedback (obviously?), aspects that can be better, bugs I can solve, and bad practices I can avoid. Thanks c:

    @atekron

    Posted

    I'm currently also doing this challenge, and very glad that I decided to use Sass and BEM for this project, after some initial hustle it's a breeze to work on my project, my longest scss file has 100 lines, rest of them about 40 lines each, so probably it's not bad idea to use sass at least.

    1
  • @atekron

    Posted

    wrap your image in some wrapper and rest of content in another one, then declare your container as a flexbox, or u can use grid to position everything however you want

    1
  • @atekron

    Posted

    thank you for feedback, I now switching to desktop at 1250px, at lower values it results in horizontal scrollbars

    0
  • @atekron

    Posted

    thanks for commenting, it's by design this way, I wanted to give sliders some boundary, under the hood my code uses data organized into something like json and can work with arbitrary number of data entries

    0
  • @atekron

    Posted

    hi, you need to adjust your media queries, because of screens less than 600px it's looks kind of bad, also I would suggest making pattern-bg.svg as a background on an image wrapper and quotes svg background on a quote text

    0
  • @karanmishra0904

    Submitted

    How do I have 50% width for the image and also keep it responsive? Also, is there any way I could have been more efficient with my css?

    Any other feedback would be appreciated. Thanks a lot.

    @atekron

    Posted

    I would use a separate css file for my styles, and I'd rather start my design from mobile version, just because it easier to scale up

    0
  • @atekron

    Posted

    you actually should not use overlay, instead set a background of the image div to soft violet ( hsl(277, 64%, 61%)) and use "mix-blend-mode: multiply" with "opacity: 0.75"

    1