How do I make an image fit the 960 grid without stretching it out?

Discussion in 'HTML & Website Design' started by Webomatic, Nov 15, 2013.

  1. #1
    Hello, On my website I have a slider of images across the top. This is the demo of the drupal theme (the company, not my website),

    http://demo.drupalizing.com/?theme=b...masters_drupal

    All my pictures are different sizes or different kinds of shots. I don't know how to say it. I can resize in any program. If I keep the aspect ratio, the 960px will be fine, but the bottom will be stretched. How do I keep it all good and fit it in 960? If not 960, what is a good number?

    This could be a design question or an image question, so I picked one of the groups. Thanks for any help.
     
    Webomatic, Nov 15, 2013 IP
  2. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #2
    Grids are another piece of asshat nonsense that's become a sick stupid practice the past few years. I'm gonna tell you exactly what I tell anyone using a FIXED WIDTH design...

    STOP BUILDING TO SPECIFIC WIDTHS!!!

    Of course, since you're looking at off the shelf drupal themes, you're basically stuck with inaccessible bloated garbage designed to fixed widths -- going hand in hand with the

    A PROPER layout should be semi-fluid and responsive designed to no specific width and/or using breakpoints for responsive layout -- built elastic using EM instead of some stupid pixel measurement. If you have some massive 'perfect width' image nonsense on the page, you're building the site ALL WRONG.

    No matter what the sleazeball scam artists on the various "template" websites will try to sell you.

    Of course, the URI is mangled/invalid in your post... do you mean the "blueMasters" theme? If so, do yourself a favor and forget that trash. Between the 'superfish' asshattery using javascript to do CSS' job, endless pointless DIV and CLASSes with nothing remotely resembling semantic markup, inaccessible grid nonsense, px metric widths and fonts on content, and 25k of markup doing 10k or less' job... Yeah, it's got problems.
     
    deathshadow, Nov 15, 2013 IP