Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Using :after on an Inline Element: Firefox no-likey Re: Using :after on an Inline Element: Firefox no-likey

#106433
TheDoc
Member

Ended up with a jQuery solution. Not my favourite thing to do, but if the boss wants no widows the boss gets no widows.

jQuery:

// link title, no widow
$('#blog .type-link h1 a').each(function() {
var wordArray = $(this).text().split(" ");
wordArray[wordArray.length-2] += ' '+wordArray[wordArray.length-1]+' ';
wordArray.pop();
$(this).html(wordArray.join(" "));
});

SCSS:

#blog article.type-link h1 a {
position: relative;

.link-arrow {
background: $highlight;
display: inline-block;
width: 20px;
height: 20px;
vertical-align: top;
margin-top: 3px;
}

span {
white-space: pre;
}
}