aligning images on main page?

Is there anyway I could align the main category images? they don't seem to be lining up correctly.. there are some higher than the others. Here's a link to show what's going on.oembargain.com

Thanks! Help is much appreciated!

Best way to do that is to simply make all your images the same size.

Don't forget to set your images sizes in admin/config/images to match as well.

Zen will take care of the alignment if these values are the same.

Good Luck

Dalton

Cchan,

If you mean 'aligning text below the images' then I've been doing what daltonkost suggested, but this is such a basic requirement I decided to have a dig about for an 'easier' fix...

You need to edit: /includes/modules/YOUR TEMPLATE/category_row.php

If a folder for YOUR TEMPLATE doesn't exist in /includes/modules, then create one then copy /includes/modules/category_row.php into it.

eg. you're using the pure_black_free template, so create the folder /includes/modules/pure_black_free and copy category_row.php into it.

In category_row.php around line 39 you'll see...

    $list_box_contents[$row][$col] = array('params' => 'class="categoryListBoxContents"' . ' ' . 'style="width:' . $col_width . '%;"',
                                           'text' => '<a href="' . zen_href_link(FILENAME_DEFAULT, $cPath_new) . '">' . zen_image(DIR_WS_IMAGES . $categories->fields['categories_image'], $categories->fields['categories_name'], SUBCATEGORY_IMAGE_WIDTH, SUBCATEGORY_IMAGE_HEIGHT) . '<br />' . $categories->fields['categories_name'] . '</a>');

Now add an extra DIV tag named catImgWrapper around the image on that line (the two changed bits are in red)...

    $list_box_contents[$row][$col] = array('params' => 'class="categoryListBoxContents"' . ' ' . 'style="width:' . $col_width . '%;"',
                                           'text' => '<a href="' . zen_href_link(FILENAME_DEFAULT, $cPath_new) . '"><div class="catImgWrapper">' . zen_image(DIR_WS_IMAGES . $categories->fields['categories_image'], $categories->fields['categories_name'], SUBCATEGORY_IMAGE_WIDTH, SUBCATEGORY_IMAGE_HEIGHT) . '</div><br />' . $categories->fields['categories_name'] . '</a>');

The last thing you need to do is edit your stylesheet (in your case it is 'includes/templates/pure_black_free/css/stylesheet.css') and add...

.catImgWrapper {
    height: 120px;
}

Obviously set the height to whatever you need.

Thank you all!