Bootstrap Align two divs vertically
If you are using the Bootstrap framework while working on an HTML webpage and want to align two div elements vertically, then the below code will help you achieve it.
Bootstarp HTML Code Snippet:<div class="container" id="container_div">
<div class="row v-align" id="outer_div">
<div class="col-xs-4" id="div_1">This is Div 1</div>
<div class="col-xs-4" id="div_2">This is Div 2</div>
</div>
</div>.v-align {
display: inline-block;
float: none;
vertical-align: middle;
}Comments:
- Short and sweet example.
AnkitJ 11 Nov 2020 21:20:11 GMT
- Further comments disabled!
More Posts related to Bootstrap,
- How to disable button in Bootstrap
- Bootstrap tooltip not working
- Bootstrap Button Colors Classes
- Rounded Images in Bootstrap framework
- Right Align Text in Bootstrap framework
- How to add hint text in bootstrap input text field and text area
- Create Bootstrap carousel slider with Text
- Bootstrap Nav Menu Dropdown on hover
- [Solved] Bootstrap tooltip not working
- Align left align text in Bootstrap
More Posts:
- Terminal display next month Calendar - Linux
- Unbound classpath container: JRE System Library [JavaSE-1.7] - Java
- INSTALL_FAILED_INSUFFICIENT_STORAGE Android Error - Android
- Bootstrap tooltip not working - Bootstrap
- SharePoint formula - Calculated columns cannot contain volatile functions like Today and Me - SharePoint
- SharePoint 2010 August 2015 Update KB3055049 - Duplicate Document ID issue bug fixed - SharePoint
- [Solution] Java Error Code 1603. Java Update did not complete. - Java
- 25 Notepad++ Command Argument List - NotepadPlusPlus
