Responsive Foundation 6.0.0

Sidebar

Configuration » Z-Index Z-Index - StatesLink

Since: 2.0.0 New Issue

A base z-index to use for content with multiple states. A good example of this content might be a form with multiple states stacked on one another that you animate. Use this variable for your default state.

Use + or - with this variable to set z-index relative to the default state - plus for above, minus for below. Change this variable to change the stacking order for all states in the site.

Examples

Set z-index on a stacked form with states.
		.form-state-start,
			.form-state-active {
				z-index: $z-index-states;
			}
		
			.form-state-getinfo {
				z-index: $z-index-states - 1;
			}
		
			.form-state-end {
				z-index: $z-index-states - 2;
			}
Source: _config.scss, line 379 View Source