Wrap Bootstrap导航栏列出围绕中心品牌形象的项目 [英] Wrap Bootstrap navbar list items around centered brand image

问题描述

我一直没有解决这个问题。我使用bootstrap 2.32（对于joomla模板，不支持BS3），我将有动态数量的列表项。我需要的列表项目是中心，但也平均包裹在中心.brand img的左边和右边。我可以把它分成单独的菜单，但什么是有趣的。因此，我首先需要 Bootply 进行测试。

Ive been messing with this all night with no solution. I am using bootstrap 2.32 (for a joomla template, not support BS3 yet), and I will have a dynamic number of list items. I need for the list items to be centered, but also wrapped equally to the left and to the right of a centers .brand img. I could break it up into separate menus, but what would be the fun in that. So I have a Bootply up for testing purposes first. I'm open to any suggestions for accomplishing this.

推荐答案

您可以将图片移动到列表的中心，与后端或javascript：

You could just move the image into the center of the list, either with the backend or with javascript:

<script>
var $nav = $('.nav li');
var $middle = $nav.eq(Math.ceil($nav.length/2));
var $liWrappedImg = $('<li></li>').append($('.brand'));
$middle.before($liWrappedImg);
</script>

这篇关于Wrap Bootstrap导航栏列出围绕中心品牌形象的项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！