Position navigation from bootstrap left and right from an image - html

Question

currently not knowing how to continue. I got an absolute positioned div element at the bottom of the page. I want to place a logo which is centered and also left and right from the logo i want to place the navigation ( i am working with bootstrap ). Here is an image from my idea so you can get a better view:
Here is my code of the position absolute div at the bottom. I kinda lost it pretty fast and appreciate every help i can get!
<div id="footmenu">
<div class="container navresize">
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navleft">
<li>Home</li>
<li>Portfolio</li>
<li>Über uns</li>
<li></li>
<img src="images/logo.png" />
</ul>
</div>
</div>
</nav>
</div>
</div>
CSS:
#footmenu {
background:grey;
position: absolute;
bottom: 0;
width: 100%;
height: 150px;
}
( I deleted the rest of the css because i was pretty sure that it was wrong )
Again thanks for the help and i appreciate your time !
Edit: Will update the jsfiddle now. Here is a result i found which shows perfectly what i want to get: http://www.templatemonster.com/demo/39221.html
Here is the jsfiddle: http://jsfiddle.net/Su6VF/2/embedded/result/

Answer 1

You can try with inline-block display for the divs containing the list items and the logo and text-align:center to the wrapping div to position these in the center.
Check this FIDDLE
This might help you. Here is the styles used
.row{
text-align:center;
}
.col-md-4{
display:inline-block;
float:none;
width:auto;
}