Ordinarily, you will not need to resize the photos on your website because Rocketspark does it all for you, automatically scaling down the picture to fit the column. However, they may be times when you need to make a few manual edits to suit your site design.
So why are my photos different heights?
It all hinges on the photo’s dimensions (the technical term is aspect ratio). Rocketspark automatically resizes the photo to match the width of the column but retains the same dimensions. The upshot of this is that photos with different dimensions will be different heights automatically but you can change this using the Rocketspark Picture Editor.
Quickly adjusting Height, Crop and Zoom
Simply drag the zoom tool up and down to adjust how zoomed in or zoomed out you need the picture in this space. Be aware that you can now zoom the picture smaller than the original size marked with a line.
Drag the bottom handle up and down to adjust the image height. This handle is specially designed to SNAP to other images next to it so you can quickly line things up perfectly.
Cropping the exact part of your image is a breeze, just left-click anywhere on the image and drag to position the exact part of your image that you want to be visible. You can also adjust the Width, Height and Alignment from the sidebar under Size.
Why are my photos different widths?
One possible reason is that your columns are different widths.
If columns are the issue, you just need to change the layout of the stack. Click Add stack and choose a layout where the columns are all the same width (e.g., the 2-, 3- and 4-column layouts). This way all your pictures will resize to the size of the column making it easy to keep them all unified.
Alternatively, your images are zoomed out too far and so the width has gone smaller than the column width. To fix this, click the edit pencil on the image and drag the Zoom slider up until the zoom is at 100%.
