BACKGROUND HEIGHT


Background Height is used to stretch the height of the background colour or image so that it is full height.

MOBLE CMS Background Height


Background Height is also used to vertically align columns that sit adjacently to each other within a row, particularly when the column have varying amounts of content within them. To achieve this it is important to:

  1. Set the two most inner frames to Background Height Full.
  2. Know that, if you set the Frame Height (e.g. to 500px), this will override the background height.
  3. Though, there is no harm in using background height if you are using Frame Height.

EXAMPLE:

Let's say you have a 3 columns sitting in a row:

  • The Left Column has 400 characters of text and a yellow background
  • The Centre Column has 200 characters of text and a blue background
  • The Right Column has 300 characters of text and a green background

Background Height is used to to do two things:

  1. It makes the background colours to be full height for each column
  2. It makes the backgrounds of the 3 column align neatly across the bottom, essentially stretching both the Centre Column and the Right Column to be the same height as the taller Left Block (the Left Block is taller as it has more content).

ADVANCED TIP:

MOBLE CMS comes with many pre-formatted layouts. There are many layouts with columns (e.g. 2 columns, 3 columns etc).

When in 'Design' mode, in most scenarios, you will notice that the two inner-most frames have 'Background Height' set to 'Full'. This ensures both the height of the background and the height of the border are aligned perfectly. If you notice that if your column heights are not vertically aligning, ensure that the two innermost frames have the identical settings. 

The two inner frames should look something like this:

  • Alignment: Both inner frames for all columns should have 'Background Height' set to 'Full'. 
  • Padding: Both inner frames will have either the 'Container' set to 'On', or the 'Padding' set to 'Wrap'.
  • Border: The second inner frame is often used for the border. This should have consistent Border settings across all frames.

LAUNCH


14 DAY FREE TRIAL

MINI


12 PAGES

PLUS


50 PAGES

PRO


500 PAGES

CUSTOM


UNLIMITED PAGES