0

我有一个使用 Twitter Bootstrap 和 Rails 3.2 的简单导航栏

<header class="navbar navbar-fixed-top">
 <div class="navbar-inner">
 <div class="container">
  <%= link_to logo, root_path, :class=>"logo1" %>
  <nav>
  <ul class="nav pull-right">
   <% if signed_in? %>
    <li class="hova"><%= link_to "#" %></li>
    <li class="hova"><%= link_to "#" %></li>
    <li class="hova"><%= link_to "#" %></li>
    <li class="hova"><%= link_to "#" %></li>
    <li id="fat-menu" class="dropdown">
     <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-user"></i><b class="caret"></b>
     </a>


 </header>

到目前为止，徽标位于居中工具栏的左侧，链接和下拉插入符号位于右侧，每侧没有间距。

我如何为两者添加一些填充/边距（将徽标向左移动约 5 像素，将右侧内容向右移动约 5 像素，因此我牺牲了中心空白而不是移动内容。

例如，

.navbar .container {
 width: 960px;
 margin-left:10px;
 }

..适用于左侧。但是我怎么能同时为权利实现同样的目标呢？抱歉，不是前端设计师。

谢谢你。

4

2 回答 2

1

将徽标放在一个跨度中

<span class="logo"><%= link_to logo, root_path, :class=>"logo1" %></span>

然后使用 CSS 作为 -

.logo{
    margin: 0 0 0 -5px;
}

.dropdown{
    margin: 0 -5px 0 0;
}
于 2012-05-31T07:05:43.457 回答
0

试试这个

<img src="logo.png" style="margin-left:-5px;" />
于 2012-05-31T07:11:04.097 回答