如何将字形与手风琴标题的第一行对齐

Question

请看我的演示：http://www.bootply.com/COm6fikZKx

我正在考虑对齐 2 个字形图标- 折叠打开时为“向下箭头”，折叠关闭时为“向右箭头”。

手风琴标题/标题到 2 行和移动版本时会出现问题

如何使字形图标始终与左侧的第一行对齐，而不是下降到文本的最后一行？

非常感谢！

Answer 1

CSS 已修改。在CODEPEN 处查看示例代码。它会解决你的问题.. :)

.panel-title {
  position: relative;
}

.panel-heading .accordion-toggle {
  padding-left: 25px;
  display: block;
}

.panel-heading .accordion-toggle:after {
  font-family: 'Glyphicons Halflings';
  content: "\e114";
  /*glyphicon glyphicon-chevron-right*/
  color: #333f48;
  float: left;
  position: absolute;
  left: 0;
  top: 0;
}

.panel-heading .accordion-toggle.collapsed:after {
  font-family: 'Glyphicons Halflings';
  content: "\e080";
  /*glyphicon glyphicon-chevron-down*/
  color: #333f48;
  float: left;
  position: absolute;
  left: 0;
  top: 0;
}