: Re: css - select only when followed by specific element I have a specific problem in which I need to remove the margin-bottom of every Element that has a class only when followed by the same

0 Reactions

As you've discovered, the challenges here are that:

in CSS, it's not possible to select a parent or ancestor element by its child; the browser applies CSS 'downwards' only; and
you can't know what CSS properties and selectors EPUB2-capable readers will actually support.

If I've understood your needs correctly, here are three possible options you could try. For readability I've renamed your 1 class as line.

Option 1

.line {
margin: 0;
}
.line + .text {
margin-top: 1em;
}

Option 2

.text + .line {
margin: 0;
}
.line + .line {
margin: 0;
}

Option 3

* + .line {
margin: 0;
}

I've created a pen here to demo these: codepen.io/arthurattwell/pen/NQKRrp Just comment out/uncomment the options in the CSS to see how they behave there. You'd need to test in some older EPUB2 readers to see what really works. As @idiotprogrammer explains, support for the adjacent sibling selector (+) is very unpredictable. As I see it, users whose readers support it get your ideal spacing, and those that don't can still read the content at least.

Free books android app tbrJar TBR JAR Read Free books online gutenberg

Load Full (0)