How to put 3 images in one line and 4 in another?

 Method 1

The first method is the simplest, in which you put 7 images on 2 lines, 4 on the first and 3 on the second aligning them in four columns. On one of the two lines, the first or last cell will be empty.

Add columns using the button in the gray horizontal panel so as to obtain four columns. Do the same on the verticle panel to get 2 rows.

Then place image elements in each cell (except one). Make sure that the image size does not exceed the width of the cell to maintain a consistent display. You can use cell properties to center the image within the cell.

You now have 7 images, 3 in one row and 4 in the other.You now only need to replace the default images with those of your site by clicking on each image. You can also assign them navigation behaviours if necessary.

The problem is that this display is not very elegant and not centered.

 Method 2

The second method will create two lines independent of each other.

If your WebBlock's main table has several columns, merge the cells in order to obtain a single cell in the row.

Then click on this cell's dropdown list to add a table element.

A 2x2 cell table will now appear within the previous cell. Remove the second line of this table by clicking on the button in the gray column. Then click the button in the table's top horizontal panel to add columns until otaining a 4x1 cell table..

You can set the cell's dimensions by clicking on the"cell properties" item in each cell's dropdown list. A 25% setting for each cell would provide consistent display for 4 cells. Then place the image elements in each cell.

Once done, return to the main table (the one whose sole cell contains the 4x1 table). On the left in the gray panel there is an icon. Click to duplicate this line underneath. You can then delete one of the columns in the second table and redefine the size of the three remaining cells. Apply, for example, widths of 33%, 34% and 33%.


Add to favorites:
© 2001-2018 Oxatis. All rights reserved.