For issues where the buttons don’t align, the CSS provided below can fix it either using Flexbox or Grid depending on how many items are in the container.
|
1 2 3 4 5 6 7 |
/*Option 1 - Flex Grid for 2 elements*/ .db-flex-column .elementor-widget-wrap { height: 100%; display: flex; flex-direction: column; justify-content: space-between; } /*Option 2 - CSS Grid for multiple elements*/ .db-grid-column .elementor-widget-wrap { display: grid; grid-template-rows: 1fr 2fr 2fr 1fr; } |
Make hero image full screen under header
|
1 2 |
height: calc(100vh - 100px); /* assuming header height is 100px */ |