Question

我已经尝试了两个小时，在标题图片下很好地对齐导航栏，但它不会这样做。前4个列表项连续排列，但最后一个列在它们下面，+导航栏不像我想要的那样居中。我到处寻找答案，没有任何作用。将非常感谢帮助。附：我是css和html的新手，所以要温柔。

var MyController = function($scope) {

    $scope.uiConfig = {
        ...
    };

$scope.eventSources = [$scope.events];

$scope.events = [
                    {
                        start  : '2015-04-20',
                        end    : '2015-04-21',
                        type: "GET",
                        url: 'http://calendar.jacarandatech.com/wp-json/posts/5/?_jsonp=?',
                        dataType: 'jsonp',
                        success: function(response) {
                            //what do I put here to display the response.title??
                        }
                    }
                ]
};

angular
    .module('MyApp', ['ui'])
    .controller('MyController', MyController);

Answer 1

您还没有足够宽度的导航栏。更改.nav规则：

.nav {
  width:750px;  <------- adjust this
  margin:0 auto;
  list-style:none;
}

我将宽度更改为800px而不是750px，现在菜单适合一行并居中。

这是一个小提琴：https://jsfiddle.net/macg14fs/

Answer 2

您的.nav对于内容来说太窄了，所以它已经包装好了。在浏览器上按F12以发现交互式调试工具。在那之后，花点时间学习一下bootstrap。

Answer 3

使用小提琴可以更容易地知道问题是什么，但试试这个：

#nav {
  width: 100%;
}

#nav > li {
  display: inline-block;
  margin: 5px 5px 5px 5px;
  text-align: center;
}

无法在标题图像下对齐导航栏

3 个答案: