inserting div dynamically in html in front of h1 tag that has margin-top of -1em
I have existing documents that I'm trying to insert logical page numbers into. In the xhtml snippet below, this is the .pagerule-cls div. I found a document that this doesn't work well with because the affecting css for the first element on the page has a margin-top of -1em. My page number insertion ends up in the center of the h1 text of the orginal document. Is there anything I can do to make sure the h1 heading "Introduction" comes after my page number insertion with appropriate pagerule-cls css?
By the way, the style on the body element is also my insertion to change the left and right margins.
Andy
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/>
<style>
.calibre14 {
display: block;
font-size: 1.5em;
font-weight: bold;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
margin-top: -1em;
text-align: center
}
.calibre4 {
display: block;
margin-bottom: 0;
margin-left: 1.25em;
margin-right: 0;
margin-top: 0;
text-align: justify
开发者_如何学Python }
.pagerule-cls {
text-align: center;
font: 13px Arial, Helvetica, sans-serif;
}
</style>
</head>
<body style='margin-left:100px;margin-right:10px;min-width:400px;max-width:800px;'><a name='stagpage6' id='stagpage6'/><div class='pagerule-cls'>7</div>
<div><blockquote class="calibre4"><span>
<h1 class="calibre14"><span><span class="bold"><a></a>INTRODUCTION</span></span></h1>
<div></div></span></blockquote></div>
</body>
</html>
The simplest way is to add margin-bottom: 1em; to .pagerule-cls, which maybe would result in a too large margin for the other documents. Better is to add this extra style only to the document in question. How do you modify the documents? Could you query for the -1em?
加载中,请稍侯......
精彩评论