Skip navigation
Currently Being Moderated

Fluid grid image resizing

Feb 26, 2013 1:32 AM

Tags: #image_resizing #fluid_grid

How do I resize images with fuild grid layouts like the Adobe Pluralist example website does?

 

I notice that the image initially centres to the section of the page it sits in, then once a size threshold has been passed, it reduces down in size. How is this acheived? I personallay give an image a width of 100%, and then rely on the aspect ratio to deal with the height, but I am told this isn't the correct method due to issues created by IE, so what should I be doing?

 

Thanks.

 
Replies
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Feb 26, 2013 4:25 AM   in reply to matthew stuart

    Have you built any code so far? If so, can you put it up on a server and give us the URL so we can look at it and help you out?

     

    -ST

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Feb 26, 2013 4:47 AM   in reply to matthew stuart

    Matthew, the first place to begin would be to create a new document in DW as 'Fluid Grid Layout (FGL)' in DW CS6. Pluralist site is a responsive site, exactly what you can achieve with DW CS6.

     

    This 3 part tutorial is a great place to start - http://webdesign.tutsplus.com/series/dreamweaver-cs6-fluid-grids/

     

    All the best!

     

    -ST

     
    |
    Mark as:
  • Currently Being Moderated
    Feb 26, 2013 4:55 AM   in reply to matthew stuart

    > I have been told that IE doesn't hold the aspect ratio

     

    You have been told wrongly

     

    --

    Kenneth Kawamoto

    http://www.materiaprima.co.uk/

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points