在Redmine默认主题中扩展长项目标题的标题

Question

我正在尝试调整标准 Redmine 主题来解决页面标题中长项目标题面包屑的包装问题。该问题使得严重嵌套的项目标题显示如下：

我发现了几个 门票 和 董事会帖子涉及类似问题，但没有人提出适当的解决方案。

我想做的是将 #main-menu 保留在 #header 的底部，并在文本时展开 #header包裹。只需使 #header 大于初始固定的 height 就可以了，但对于短标题来说看起来有点奇怪。有没有一种好的方法可以在不完全重新设计标题的情况下做到这一点？ （这是我的后备想法）。理想情况下，我也想在不从列表中删除项目的情况下执行此操作。

我认为 Redmine 官方网站 上的布局使用相同的 CSS 和 HTML 供参考，但相关位是：

HTMLCSS

<div id="header">
    <div id="quick-search"></div>
    <h1>
      <a href="" class="root">Test Project</a> » … » 
      <a class="ancestor">Really long project title 2</a> » 
      <a class="ancestor">Really long project title 3</a> » 
      Really project title 4
    </h1>
    <div id="main-menu">
      <ul>
        <li>...</li>
        ...
      </ul>
    </div>
</div>

​

#header {
  height: 5.3em;
  margin: 0;
  padding: 4px 8px 0px 6px;
  position: relative;
}

#main-menu {
  position: absolute;
  bottom: 0px;
  left: 6px;
  margin-right: -500px;
}

Answer 1

这在 Chrome 中对我有用。没有在其他地方测试过。

将 header div 中的 div 更改为浮动，如下所示

#quick-search {
float: right;
margin-top: 0.8em;
width: 25%;
text-align: right; 
} 

#header h1 {
margin-top: 0.3em;
margin-left: 0px;
float: left;
width: 75%;
}

#main-menu {
float: left;
clear: both;
left: 6px;
}

您可能需要调整宽度。

还要在 main menu div 之后、header 的 之前添加 br

 <br style="clear:both">

删除#header div 上的 height