[rablampain]

I have the following HTML code which renders as expected in the browser (Firefox), that is when clicked, the link pointed to within the <div ..></div> tags renders at the top of a new window as specified in the css file and is highlighted that way but the ebook reader (Calibre) only shows a new window in which the link (from over 200 of them) could be rendered anywhere and the CSS formatting is ignored necessitating to read the whole window to find it.

I have only basic knowledge on the subject, I understand the browser considers the link as part of the <div></div> block and the link inherits the css formatting of the <div>, if this is correct, how can I accomplish the same result with the Calibre?
Else, I am missing something, what is it?

If the CSS inherit keyword is the answer, I could not figure how to use it.

Thank you for your help.

HTML code

<div class="quote">
"Government today is growing too strong to be safe. There are ..."
<br>
<a href="#H.L._Mencken">H.L. Mencken</a>
</div>
..
..
..
<p id="H.L._Mencken">
September 12, 1880 - January 29, 1956<br>
Was an American journalist, satirist, cultural critic and scholar of American English.
</p>

CSS code

p {
page-break-inside: avoid;
}
.quote {
page-break-inside: avoid;
background-color: silver;
text-align: center;
}