The absolute position property is one of four main position types available within Divi’s new position options. In this tutorial, we will explore what it means to give an element an absolute position in Divi and how you can use it to your advantage when designing Divi sites.
In this post we’ll cover:
- An Overview of Divi’s Four Types of Positioning
- How the Absolute Position “Positions” an Element in Divi
- Benefits and Drawbacks of using the Absolute Position in Divi
- Using the Location Points with the Absolute Position
- Example Use Case: Positioning Buttons Absolutely for Same Height Blurbs
Check it out!
Overview of Divi’s Four Types of Positioning
The absolute position is one of four position options available in Divi. Here is a quick overview of each one below.
Static (Default)
Static elements technically aren’t “positioned” since they stay with the normal flow or order of elements on the page, and they don’t respond to the top, right, bottom, and left properties like other positioned elements (which is why no offsets are available in Divi for elements in the static/default position). The static position is the default position for any CSS element. In Divi, when you choose the default position for a module, you are choosing the static position. It is also worth mentioning that some elements in Divi (like rows and sections) will have a relative position by default (not the static position).
Relative
Relatively positioned elements are kind of like static elements in that they follow the normal flow of the page. The main difference is that relatively positioned elements can be positioned using the top, bottom, left, and right properties. Also, unlike static elements, they can also be positioned using the Z Index property.
Absolute
[…]
This article was written by Jason Champagne and originally published on Elegant Themes Blog.