css - Align paragraphs to left and right, and center image on footer -

i need display 1 paragraph aligned left, paragraph aligned right, , centered image, on same line on footer of webpage.

how achieve that? current code gets second paragraph on new line.

html

<div id="footer">     <p class="alignleft">text</p>     <img id="logo" src="#">     <p class="alignright">more text</p> </div> 

css

.alignleft {     float: left; }  .alignright {     float: right; }  #logo {     display: block;     margin-left: auto;     margin-right: auto; } 

hope helps you:

<div id="footer">     <span>text</span>     <span><img src="http://www.klm.com/jobs/nl/images/icon_flight_32x32_tcm701-312701.gif" /></span>     <span>more text</span> </div> 

#footer {     width: 100%;     display: table;     table-layout: fixed;     background: gray; } #footer span {     display: table-cell; } #footer span:nth-child(2) { text-align: center; } #footer span:last-child { text-align: right; } 

jsfiddle demo