0

私はこのコードを持っています:

 <div class="well sidebar-nav">
    <ul class="nav nav-list">
      <li class="nav-header">Pacientes</li>
      <li class="active"><a href="#"><img src="../../img/catalogo_pacientes.png"/></a></li>
      <li><a href="#">Editar Paciente</a></li>
      <li><a href="#"><img src="../../img/add_paciente.png"/></a></li>
      <li class="nav-header">Administrativo</li>
      <li><a href="#"><img src="../../img/exportar_dados.png"/></a></li>
      <li><a href="#">Adicionar Campos</a></li>
    </ul>
  </div><!--/.well -->

li コンテンツが同じ行にとどまるように、できればそれらの間にパディングを入れて、それを作成する方法を理解できません。

display:inline でいくつかのテストを行っていますが、CSS に配置する正しい方法がわかりません

- 編集 -

ここにコメントを追加するにはいくつかの問題があるため、ここで編集します。

あなたが提示した解決策はうまくいきました！ありがとうございました！

4

2 に答える 2

0

リストを 1 行に表示するには、css にdisplay: inlineプロパティが必要です。このプロパティはli要素に適用する必要があります。

この CSS は問題なく動作します。パディングにも注意してください。

ul li {
  display: inline;
  padding: 10px;
}

コーディング中は、要素に ID を与えてから、一般的な要素<ul>に適用するのではなく、その ID に CSS を適用してください。<li>

JSFIDDLE デモ

于 2015-12-21T20:01:25.623 に答える