HTML, CSS, Bootstrap - Two columns with centering -


i trying make little website should have 2 columns, , each column should have content centered.

however, have noticed columns follow height of each other, , not act individual columns. e.g. whenever add content 1 of columns, content of other column moved fit height of column.

in jsfiddle, can see "hello" on right side not centered; has been moved stand in line first of 3 "hello"'s on left side. so, whenever add content 1 column, doesn't affect other - "hello" on right side should ideally stay centered.

jsfiddle: https://jsfiddle.net/goupb2ch/1/

i have worked on quite while now. ideas? thanks!

consider using flexbox solve problem: in case far less code required.

https://jsfiddle.net/upwgk2u4/

.container {   display: flex;   text-align: center;   height: 100%; }  .container > div {   flex: 1;   align-self: center; } 

Comments

Popular posts from this blog

PHP and MySQL WP -

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

go - golang pprof for c library code -