3

これが私が目指していることです:https ://docs.google.com/file/d/0B13W1jkpc_BzLXZ6RGxGbUd2NG8/edit?usp = Sharing

これが私のアプローチのCSSです:

@media (min-width: 980px) {
.dropdown-menu .sub-menu {
  left: 100%;
  position: absolute;
  top: 0;
  visibility: hidden;
  margin-top: -1px;
}
ul.nav li.dropdown:hover > ul.dropdown-menu {
  display: block;
}
a.menu:after, .dropdown-toggle:after {
  content: none;
}
.navbar .dropdown-menu {
  margin-top: 0px;
  text-align: center;
}}

そして今の様子:https ://docs.google.com/file/d/0B13W1jkpc_BzZUlRck5VcWh0TkE/edit?usp = Sharing

ドロップダウンメニューのテキストに適切な幅を取得できないように見えることを除いて、すべてが正常に機能しています(テキストに応じて幅を縮小する必要があります)。それで、どうすればそれを行うことができますか?

4

3 に答える 3

13

min-widthリストのプロパティを削除する必要があり.dropdown-menuます。ブートストラップを含めた、次を含めます。

.dropdown-menu {
  min-width: 0px;
}

または、指定した正確なスタイルについては、代わりにブートストラップのツールチップを使用できます

于 2013-04-23T14:43:52.157 に答える
0

.dropdown-menu .sub-menu クラスからパディングを削除してみてください。

.dropdown-menu .sub-menu {
  left: 100%;
  position: absolute;
  top: 0;
  visibility: hidden;
  margin-top: -1px;
  padding: 0;
}
于 2013-02-14T22:20:02.500 に答える
0

内側のテキストにスペースを追加すると、自動的に幅が広がります。たとえば、「--View by Category--」があります。

  で好きなだけスペースを追加してください

  -- カテゴリ別に表示 --

于 2016-06-06T18:01:25.687 に答える