Skip to content
OverviewSolutions
3
Comments
1
Zoks
@Zoksss

All comments

  • HYDROCODER•555
    @HYDROCODERSubmitted over 3 years ago

    I struggled with responsive design and even though it works for now I am not really sure if it is correct and need to some solid advice with handling images in responsive design. Media queries are not my cup of tea and so is working with images. I used the same desktop image for mobile responsive as using the picture element didn't make sense to me; I couldn't understand how to put the image attributes for the source element with the image and doubted if it would work.

    Responsive Stats Preview Card Component with HTML and CSS

    1
    Zoks•70
    @ZoksssPosted over 3 years ago

    Hey, I achieve that changing image with simply adding empty div for image (no image in html) and after you can change image trough css with background-image: url(); and based on responsive you can change it afterwards easily, but I have seen people also use 2 img tags for 2 images, and then they hide one they don't need trough css.

    Responsive looks alright, but you have multiple declaration of same thing. Eg. in .container { color: white; } and you have exact same thing in responisve down. You should remove unnesasery lines. Also you can look up mobile first responsive, which in my opinion is kinda easier, but its important nowdays.

    Also you could learn SCSS which is CSS preproccesor, its basicly CSS with more cool features.
    You will still learn CSS, but you will increase productivity, and its pretty much standard today.

    Hope this helps :)

    Marked as helpful
    0