How to achieve a layout with 3 columns and a footer - html

Question

I am trying to build this footer with bootstrap 3.3. The footer looks like this:
Text Left - Social Icons - Text Right
Here is what I tried:
http://jsfiddle.net/bsumgcpk/1/
<div class="container black">
<div class="col-xs-6 col-sm-4 white"><p> COPYRIGHT © 2014</p></div>
<div class="col-xs-6 col-sm-4 white text-center">
<img src="icon-g-.png" alt="google+">
<img src="icon-twitter.png" alt="twitter">
<img src="icon-fb.png" alt="facebook">
</div>
<div class="col-xs-6 col-sm-4 right"><p> right text</p></div>
</div>

Answer 1

You forgot to put the columns inside row div.Bootstrap has 12 column grid system, so the sum of your columns should be 12.Thats why i used 3 columns of size 4.
Working JSFiddle.
p {
color: white;
}
.black {
background: #000;
}
.right {
text-align:right;
}
<link href="http://www.kissingerassoc.com/~order-portal/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container black">
<div class="row">
<div class="col-xs-4 col-sm-4 white">
<p>COPYRIGHT © BITPHONE.ES 2014</p>
</div>
<div class="col-xs-4 col-sm-4 white text-center">
<img src="https://bitphone.es/wp-content/uploads/2015/07/icon-g-.png" alt="google+" />
<img src="https://bitphone.es/wp-content/uploads/2015/07/icon-twitter.png" alt="twitter" />
<img src="https://bitphone.es/wp-content/uploads/2015/07/icon-fb.png" alt="facebook" />
</div>
<div class="col-xs-4 col-sm-4 right">
<p>right text</p>
</div>
</div>
</div>