首页 \ 问答 \ 子菜单悬停显示限制(Submenu hover display restriction)

子菜单悬停显示限制(Submenu hover display restriction)

我有个人项目的问题, http://mail.fixca.com.gt/ 。 在Drupal 8上使用配置文件头脑风暴

菜单不显示创建的子菜单。 我已经:

  • 在菜单项上设置显示扩展模式。
  • 设置块上的最大菜单级别显示。
  • 试图创建一个新的菜单和CSS它让它显示子菜单

    .submenu {display:none; }

    .companymenuli:hover> ul {display:block; }

但它从不显示子菜单。 我意识到这可能是我做得不对的事情,但我找不到解决方案。

Drupals网站上的HTML显示如下

来自Chrome开发人员的HTML

我认为这可能是对主题本身的某种限制。

我非常感谢你的帮助。 如果你有什么提示,我可以在哪里找到解决方案。

谢谢。


I have a problem with a personal project, http://mail.fixca.com.gt/. on Drupal 8 with the profile Brainstorm

The menu doesn't display the submenus created. I have already:

  • Set Show Expanded mode on the menu item.
  • Set the max menu level display on the block it self.
  • Tried to create a new menu and CSS it to get it display the submenu

    .submenu{ display:none; }

    .companymenuli:hover > ul{ display:block; }

but it never shows the submenu. I realise that it might be something I'm just not doing right, but I cann't find the solution.

The HTML on the Drupals Website shows like this

HTML from chrome developer

I think that it might be some kind of restriction on the theme itself.

I really appreciate your help. If you have give mi a hint on where I might be able to find the solution.

Thank you.


原文:https://stackoverflow.com/questions/42409208
更新时间:2023-07-27 17:07

最满意答案

我找到了这个问题的答案。 你只需要用下面的CSS来实现一个类。

.truncate{
display:block;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis
}

I found an answer to this problem. You simply have to implement a class with the following css.

.truncate{
display:block;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis
}

相关问答

更多
  • 我这样做了(你需要在添加一个类文本并将文本放在 : HTML looooooong teeeeeeeeext 上海社会科学院 .table td.text { max-width: 177px; span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; di ...
  • 您可以使用视口值而不是ems,pxs或pts。 1vw =视口宽度的1% 1vh =视口高度的1% 1vmin = 1vw或1vh,以较小者为准 1vmax = 1vw或1vh,以较大者为准 试试font-size:7vw; 。 .circle { width:100%; height:100%; border-radius:250px; font-size:7vw; //changed this color:#fff; text-align:center; background:#000 } 在这里演示 ...
  • 使用另一种方法使文本居中。 这是flex的一个想法: .circleBase { border-radius: 50%; } .contact-circle { position: fixed; width: 23%; height: auto; padding-top: 23%; background-color: rgba(255, 86, 86, 0.2); } #contact-text { top: 0; position: abso ...
  • 这个片段解决了你正在寻找的东西,并列出它的失败(句号可能不表示句子结束,其他标点符号可以结束句子)。 它会扫描最多$maxLen字符,然后在找到的最后一次完整停止后有效地“丢弃”部分句子。 在你的情况下,你在返回$new_text之前就使用了这个函数。 This snippet solves what you're looking for, and lists it's failures (full stops may not indicate sentence ends, and other punctu ...
  • 我找到了这个问题的答案。 你只需要用下面的CSS来实现一个类。 .truncate{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis } I found an answer to this problem. You simply have to implement a class with the following css. .truncate{ display:block; white-space:n ...
  • .rect{ margin:0 0 20px; padding: 20px; border:2px solid #333; width 80%; text-align:center; } .header{ margin:0 auto; padding: 5px 10px; width:90%; border:2px solid #333; } .box{ margin: 5px 0; border:2px solid #3 ...
  • 您可以尝试text-overflow: ellipsis : td { white-space: nowrap; overflow: hidden; /* "overflow" value must be different from "visible" */ text-overflow: ellipsis; } 警告:如果没有在列上设置显式宽度,旧版本的IE会做奇怪的事情, You could try ...
  • Canvas不支持css vw单元。 那么,你应该用...... ctx.font = 2 * window.innerWidth + "px Arial"; 代替 ... ctx.font = "2vw Arial"; 这是关于jsFiddle的工作演示 Canvas doesn't support css vw unit. SO, you should use ... ctx.font = 2 * window.innerWidth + "px Arial"; instead of ... ctx ...
  • 对我而言,这样的事情正在发生: truncate -s +4096 myfile.txt 这会将4069字节附加到给定文件。 我想你错过了加号。 For me something like this is working: truncate -s +4096 myfile.txt this appends 4069 bytes to the given file. I think you miss the plus sign.
  • 尝试这个