Grow your CSS skills. Land your dream job.

Fluid/Responsive image & RWD

  • # February 26, 2013 at 12:08 pm

    Hi,

    I’m working on a project html5 responsive design, I’, asked me to provide the sizes of visual products for mobile and ipad my question is how to calculate the size of an image for mobile contribution to the origin image (desktop image).

    I got images of 244px width and 136px height how can i calculate the equivalent images for mobile (i already use picturefill as pluging)?

    Thank you in advance for your answers.

    # February 26, 2013 at 12:18 pm

    Are your images responsive at all?

    I think this usually works…

    img {
    width: 100%;
    height: auto;
    }

    # February 26, 2013 at 12:23 pm

    Im using https://github.com/scottjehl/picturefill as plugin my images are fluid but i need to know dimensions of images for ipad and mobile for back office.

    I know that we got 1 large 1 meduim and 1 small image but i need to know how i can resize my image from 244px to how much????

    Thanks

    # February 28, 2013 at 6:34 am

    Hi,

    I think its ok i ve tried to devise my container to 2 ex:
    my large image is 244px for 980px (secreen)
    for mobile 320px(screen)/2(my container 50% of space)=160px .

    Not sure it’s correct but it solved my probleme.

    Thanks for all

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".