Question

我正在使用jquery ui标签，默认情况下，标签必须至少为<li>元素。

我只需要2个标签，但我无法调整它们的大小以使它们相等并占据ul的可用宽度的100％。

这是我的代码。

<div id="intro_tabs" class="tabs">
    <ul id="intro_nav">
      <li>
        <h3><a href ="#tabs-1" class="null_link"><%= t('home.index.what_is_it') %></a></h3>
      </li>
      <li>
        <h3><a href ="#tabs-2" class="null_link"><%= t('home.index.how_works') %></a></h3>
      </li>
    </ul>
    <div id="tabs-1">
      <%= simple_format t 'home.index.what_intro_details' %>
    </div>
    <div id="tabs-2">
      <div id="intro_accordion">
        <h3><a href="#">Users</a></h3>
        <div>
          <%= t 'home.index.how_intro_details_user' %>
        </div>
        <h3><a href="#">Merchants</a></h3>
        <div>
          <%= t 'home.index.how_intro_details_merchant' %>
        </div>

      </div>
    </div>
  </div>

我已尝试在两个li上使用css属性width:50%，但它不起作用。

由于

Answer 1

要做你想要的，你需要确保两个列表项都适合你的ul。如果您希望它们占用所有空间并具有填充或边距，则不能使用50％和em值作为填充b / c总是最终＆gt; 100％并让您的物品分布在两条线上。如果你想要有正确的边距，使用1％作为右边距并使宽度为49％，这样你就可以使用100％的空间并且不会换行到下一行。这个CSS将是......

#intro_nav li {
    width:49%;
    padding: 0;
    margin: 0 1% 0 0;
    list-style-type: none;
    float: left;
    display: inline-block;
}

不要忘记清除以下元素中的浮动。如果您需要更多边距/填充/边框，请使用基于百分比的值并从宽度中减去它以使元素保持适合。如果每边的边距为1％，则需要从宽度减去2％。第h

为li分配宽度

1 个答案: