Assign to and from PHP references


PHP reference is tricky and kinda weird, be careful when you use it.

Assign to PHP reference variable with a non-reference value

will output:

Assign to PHP reference variable with a new reference value

will output:

Assign from PHP reference variable to get the the reference itself

will output:

Assign from PHP reference variable to get the the referenced value

will output:


You could set or get the reference itself or the referenced value, the & is crucial!

Arrange Image tiles with different aspect ratios

Image tiles are frequently used when we want to display some artworks, design proof, image thumbnails or even video preview.  They work great, I mean, compact, tidy.

Image tiles with same aspect ratio


But sometimes, things get a little  complicated when the objects to display, say some images are in different aspect ratios. It is in fact a quite common, for pictures or videos for example, some are  portrait(vertical), some are landscape(horizontal), others may be square. We may give each of them a fixed box, and let them flow in the box, see below. But that doesn’t look good, the white space and margin are annoying, the borders are not aligned etc.

Tiles with different aspect ratio


Is it possible to display them in a way similar to these same-aspect-ratio ones? The answer is YES, let’s see how:

Method #1 Arrange Vertically

Arrange Vertically

Vertical arrangement is straightforward, just keep every column same width, and the height of each tile could be automatically calculated with the original aspect ratio of each tile. If you are doing this with CSS, it could be something like:

width:200px; height auto;

Method #2 Arrange Horizontally

Arranged HorizontallyHorizontal arrangement is not as intuitive as its vertical counterpart, we may a little explanation here. While we arrange each tile vertically with same width, we arrange each tile horizontally with same height, that is the key, the width of each row is fixed and constant, the tiles to be arranged in the row are also known, the only problem here is to find the height. so we got a simple equation:


Put it simple, view the whole row as a single tile, whose width is known as W, and height is to be calculated as H,  W is sum of width of each tile in the row, and H is same for each tile in the row, and for each tile, the aspect ratio is a constant, so width of each tile could be expressed as aspect ratio of this tile  multiplies H  ,  so the left side of the equation is a constant value, solve this simple equation, we got the height of the row. The height may be different for each row as we may put different tiles in each row, so horizontal arrangement requires more calculation.



And, as we can see from the equation, if tiles with significant aspect ratios are arranged in the same row, the result may not look that good,  the height of the row may be extremely big of small. Some website like flickr has some special handling for this situation, they display pano in a separate row. This technique is used by many websites like (they call this Mosaic thumbnails) and etc. Hope this article could help.