How to position a widget absolutely in a relatively positioned container in iThemes Builder

Modules in iThemes Builder are stacked horizontally, one below the other. Using CSS, we can make a widget vertically span across two horizontal modules.

Live demo: http://sridhar.internal.ithemes.com/widget-boxes/

CSS used in the above demo page:

#builder-module-4edf305a04bfa .builder-module-sidebar-outer-wrapper { width: 240px !important; max-width: 240px !important;
}

#builder-module-4edf305a04bfa .right { float: left;
}

#builder-module-4edf305a04bfa .right .sidebar { margin-left: 0;
}

#builder-module-4edf305a04bfa .right .widget { padding-right: 0.75em;
}

.builder-container { position: relative;
}

#text-7 { position: absolute; width: 222px; top: 200px;
}

Link to iThemes Builder: http://websitesetuppro.com/highly-recommends/ithemes-builder

Forum topic: http://ithemes.com/forum/topic/21037-can-you-merge-two-sidebars-vertically/

Category:

Howto & Style

Tags:

• iThemes
• Builder
• iThemes Builder
• CSS