我的问题与电子书格式有关，但编码与 web 的 html 和 css 非常相似。我有一个类似于引文的文本框，显示为“{text text text }”。我需要这些元素水平对齐，并在字体大小改变时继续对齐。
修改后的 html 和 css:
HTML:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xml:lang="en-gb" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Lies They Teach in School</title>
<link rel="stylesheet" type="text/css" href="stylesheet.css"/>
</head>
<body>
<h2 class="h2">O<small>UR</small> F<small>IRST</small> P<small>RESIDENT</small></h2>
<div id="bigbox">
<div class="textbox">
<div class="imageleft"><img src="images/c1.jpg" alt="Image"/></div>
<div class="imageright"><img src="images/c2.jpg" alt="Image"/></div>
<div class="noindentt">George Washington was the first president of our country.<br/><b>Don’t you believe it</b>.</div>
</div>
</div>
<p class="indent">In the formative days of our union, dating from September 1774, seven men, beginning with Peyton Randolph of Virginia, held the office of president of the Continental Congress, the first functioning government of our fledgling nation.</p>
<p class="indent">With the adoption of the Articles of Confederation, in March 1781, the Continental Congress officially became the “United States, in Congress Assembled,” marking the beginning of transition from an alliance of colonies to a central government. John Hanson of Maryland was unanimously chosen as the first presiding officer serving a full term under the Articles. Because of his prominence in the Revolution and his influence in the Congress, other potential candidates declined to run against him. Hanson is thus considered by many historians as the first “president of the United States.”</p>
<p class="indent">Hanson was the head of the government, presiding over Congress but without true executive powers, which were exercised by the Congress as a whole. Seven other “presidents” followed Hanson, including Richard Henry Lee of Virginia and John Hancock of Massachusetts, each serving an average of one year.</p>
<p class="indent">But the government under the Articles of Confederation was too inefficient for the young amalgamated country, relinquishing too much power to the several states. In response to the need for a stronger central authority, the Congress assembled for the last time in March 1789 and produced the Constitution of the United States, naming George Washington as president.</p>
<p class="indent">Thus, while George Washington was the first “president of the United States” under the Constitution, in actuality he was preceded by eight others who held that title.</p>
</body>
</html>
我只是抓取了与此页面相关的 CSS 的顶部部分。
CSS:
bigbox
{
margin-right:0em;
margin-left:0em;
margin-top:5em;
margin-bottom:1em;
padding-right:1.5em;
padding-left:1.5em;
border-color:#EF3F35;
}
.textbox
{
width:100%;
}
.imageleft
{
float:left;
height:100px;
}
.imageright
{
float:right;
height:100px;
}
.noindentt
{
font-size:1em;
padding-left:0.5em;
padding-right:0.5em;
padding-top:1em;
padding-bottom:1em;
text-align:justify;
background:green;
如果我在网络浏览器中预览我的代码，它看起来不错。但是当我在 Adobe Digital Editions 中将它作为 epub 预览时，我在正确的位置得到了标题，然后是文本框，然后是下面的图像(括号)。如果有帮助，这是 epub 的屏幕截图？
最佳答案
经过痛苦、 NumPy 、逐行调整后，我找到了问题所在。在 html“bigbox”中，我从“bigbox”div 中删除了“noindentt”并将其更改回 p 标签；不得不对填充等进行调整，但让它起作用了。感谢@Arun Kumar M 在图像对齐方面提供的帮助 - 帮助非常大!我几乎完成了这个元素的工作 - 哇!
关于用于电子书的 html 和 css 对齐图像和文本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32389736/