It is very important for the user to know the options Osmosis offers in Rows in order to place correctly the elements given.
Options are plenty; let’s have a look:
Give a name for the section (row). This will be useful if you need an anchor menu (see Anchor Menus in this documentation)
Give a title for the section (row). This will be useful if you need a title for the side dot navigation (see Menus in this documentation).
Choose the color for your fonts so texts will be readable.
Set the color for your headings. Select among default, light, dark or one of the primary colors.
In case that you like to use one of your classes.
Select among 3 different row types.
- Fullwidth Background – the background will be stretched
- InContainer – the background for this row will be in the container of Osmosis (1170px)
- Fullwidth Element – the content of this row will be stretched and not just the background
Flex Column Height
If selected columns will have equal heights. Recommended for multiple columns with different background colors.
Middle Column Content
If selected column content will be centered vertically.
Section Window Height
Select if you like your section has the window height.
Select the background for your section (row). You can use none, color, image or hosted video. Here you can set the parallax effect in case you use a background image.
You can easily increase the padding top of your section (row).
You can easily increase the padding bottom of your section (row).
Set the margin-bottom of your section (row). For example you must set 0px if you like to collapse it with the next section (row).
Check this box if the row you create is the first section just below header. This option ensures that there will be no gap between your header and your first section.
Check this box for your last section, the section just above footer. This option ensures that there will be no gap between your footer and your last section.
Here you can hide any row/section you prefer on devices. You can hide rows on tablet, both landscape and portrait orientation, and on mobiles.
If selected, the row will be hidden on desktops/laptops.
Tablet Landscape Visibility
If selected, the row will be hidden on tablet devices with landscape orientation.
Tablet Portrait Visibility
If selected, the row will be hidden on tablet devices with portrait orientation.
If selected, the row will be hidden on mobile devices.
These are major settings to specify your spaces, especially when you use multiple colored rows or rows with image background. For example: You have two rows with the full background that you want to stick each other. Just set 0px the margin-bottom of your first row.