将 H1 文本包裹在 ::before 伪元素旁边 [英] Getting H1 text to wrap beside a ::before pseudo element

问题描述

我有一个相当长的 H1 标题，其中包含一个带有伪 ::before 元素的链接，我想将其正确换行到两行.这是我需要的:

I have a fairly long H1 title containing a link with a pseudo ::before element that I want to wrap to two lines correctly. Here's what I need:

1. H1 内a 链接上的伪::before 元素(它需要可点击，因此不能位于H1 上).
   • 我成功地完成了这项工作.

1. A pseudo ::before element on an a link inside of an H1 (it needs to be clickable, so can't be on the H1).
   • I have this done successfully.

• 这就是问题所在.

在此处查看我的测试代码笔:http://codepen.io/dmoz/pen/EaZqKv

See my testing codepen here: http://codepen.io/dmoz/pen/EaZqKv

看起来应该是一个简单的修复，但我想不出是什么控制了文本的换行方式.有什么想法吗?

Seems like it should be a simple fix, but I can't think of what controls how the text wraps. Any thoughts?

推荐答案

将 float:left 添加到伪元素即可.

Adding float:left to pseudo element will do it.

检查更新的演示

这篇关于将 H1 文本包裹在 ::before 伪元素旁边的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！