2017-03-23 6 views
0

ドロップダウンメニューで正しいスペースを減らしたいと思います。Dropotron左パディングが機能しません

.dropotron li { 
      box-shadow: inset 0 1px 0 0 #e6e6e6; 
      padding-right: 0 !important; 
     } 

しかし、誰成功事例の:

enter image description here

をしてみました。何か案は?

MY CSS:

.dropotron { 
     list-style: none; 
     padding: 0; 
     background: #fff; 
     color: #444; 
     min-width: 13em; 
     padding: 0.75em; 
     margin-top: -0.5em; 
     font-family: "Raleway", Helvetica, sans-serif; 
     font-weight: 500; 
     text-transform: uppercase; 
     box-shadow: 0 0 0.125em 0 rgba(0, 0, 0, 0.35); 
    } 

     .dropotron li { 
      box-shadow: inset 0 1px 0 0 #e6e6e6; 
      padding-right: 0 !important; 
     } 

      .dropotron li:first-child { 
       box-shadow: none; 
      } 

     .dropotron a { 
      color: inherit; 
      text-decoration: none; 
      letter-spacing: 0.05em; 
      font-size: 0.8em; 
      display: block; 
      line-height: 3em; 
      border: 0; 
     } 

     .dropotron.level-0 { 
      margin-top: 0; 
     } 

      .dropotron.level-0:before { 
       content: ''; 
       border-left: solid 0.5em transparent; 
       border-right: solid 0.5em transparent; 
       border-bottom: solid 0.5em #fff; 
       display: block; 
       position: absolute; 
       top: -0.45em; 
       left: 50%; 
       margin-left: -0.25em; 
      } 

MY HTML:

<li> 
<a href="#" class="submenu fa-angle-down"><a href="#" class="image"><img src="images/flag1_a.png" alt="" /></a> 
<ul> 
    <li><a href="#" class="image"><img src="images/flag2.png" alt="" /></a></li> 
    <li><a href="#" class="image"><img src="images/flag3.png" alt="" /></a></li> 
    <li><a href="#" class="image"><img src="images/flag4.png" alt="" /></a></li> 
</ul> 
</li> 
+0

私にサイトのURLを教えてください。 –

答えて

1

例がなければ、私はちょうどここに推測しているのオフ動作するが、私はそれはおそらくmin-width: 13em;上だと思います幅を制御している.droptotronクラスです。それを減らし、役立つかどうか確認してください。

+0

あなたは正しいです。私は 'min-width:13em'を削除しました。すべてのドロップダウンは現在、テキストの幅に合わせて調整されています。ありがとう。 – Pumizo

+0

心配はいりません。あなたの問題を解決するなら、答えを受け入れてください。乾杯 –

関連する問題