需要认真的检查...
我看不出为什么这两页未对齐（居中）。我将不胜感激。
我已经遍历了代码，剥离了所有错误的内容，等等，仍然看不出为什么两个页面没有排列在一起。
第1页之后的所有页面正确排列：
这里是第1页的相关代码：
<table style="display:flex; align-items:center; flex-direction:column;"> <tr> <td style="text-align:center;"> <div id="sharing" style="padding-top:5px; text-align:center; width:500px; padding-left:0px;"> <a href="http://www.facebook.com/share.php?u=https://udhr.audio/UDHR_Video.asp?lng=nde&title=Amalungelo Omuntu Wonke Emhlabeni Wonke Jikelele" target="_blank"><img src="Images/Facebook_Icon.gif" title="Facebook" border="0" style="width:35px;"/></a> <a href="http://www.twitter.com/home?status=https://udhr.audio/UDHR_Video.asp?lng=nde+Amalungelo Omuntu Wonke Emhlabeni Wonke Jikelele" target="_blank"><img src="Images/Twitter_Icon.gif" title="Twitter" border="0" style="width:35px;"/></a> <a href="https://plus.google.com/share?url=https://udhr.audio/UDHR_Video.asp?lng=nde" target="_blank"><img src="Images/Google_Icon.gif" title="Google +" border="0" style="width:35px;"/></a> <a href="mailto:?subject=Amalungelo Omuntu Wonke Emhlabeni Wonke Jikelele&body=https://udhr.audio/UDHR_Video.asp?lng=nde"><img src="Images/Email_Icon.gif" title="Email" border="0" style="width:35px;"/></a> </div> </td> </tr> </table> <table style="display:flex; align-items:center; flex-direction:column;"> <tr> <td style="text-align:center; border:solid 1px black; padding:10px; width:480px;"> <div class="w3-content" style="width:100%"> <div class="w3-animate-opacity" > <img src="Images/img_UDHR_Cover_NDE_400px.jpg" style="bottom-margin:15px;"> <audio id="myAudio_Cover" src="Audio/nde/UDHR_Cover_NDE_DS.mp3"> Your browser does not support the audio element. </audio> <div class="w3-section"> <img id="Pause" src="images/ControlButtons_Pause_Up.jpg" onclick="document.getElementById('myAudio_Cover').pause(); this.style.display = 'none'; document.getElementById('Play').style.display = 'inline';" onmouseover="this.src = 'images/ControlButtons_Pause_Over.jpg';" onmouseout="this.src = 'images/ControlButtons_Pause_Up.jpg';" onmousedown="this.src = 'images/ControlButtons_Pause_Down.jpg';" onmouseup="this.src = 'images/ControlButtons_Pause_Over.jpg';" style="cursor:pointer; display:none;" title="Pause" /> <img id="Play" src="images/ControlButtons_Play_Up.jpg" onclick="document.getElementById('myAudio_Cover').play(); this.style.display = 'none'; document.getElementById('Pause').style.display = 'inline';" onmouseover="this.src = 'images/ControlButtons_Play_Over.jpg';" onmouseout="this.src = 'images/ControlButtons_Play_Up.jpg';" onmousedown="this.src = 'images/ControlButtons_Play_Down.jpg';" onmouseup="this.src = 'images/ControlButtons_Play_Over.jpg';" style="cursor:pointer; display:inline;" title="Play" /> <img id="Reload" src="images/ControlButtons_Reload_Up.jpg" onclick="document.getElementById('myAudio_Cover').play(); this.style.display = 'none'; document.getElementById('Pause').style.display = 'inline'; document.getElementById('Play').style.display = 'none';" onmouseover="this.src = 'images/ControlButtons_Reload_Over.jpg';" onmouseout="this.src = 'images/ControlButtons_Reload_Up.jpg';" onmousedown="this.src = 'images/ControlButtons_Reload_Down.jpg';" onmouseup="this.src = 'images/ControlButtons_Reload_Over.jpg';" style="cursor:pointer; display:none;" title="Play" /> <img src="images/ControlButtons_Next_Up.jpg" onclick="window.location.href = 'https://udhr.audio/UDHR_Video.asp?lng=nde&p=Preamble'" onmouseover="this.src = 'images/ControlButtons_Next_Over.jpg';" onmouseout="this.src = 'images/ControlButtons_Next_Up.jpg';" onmousedown="this.src = 'images/ControlButtons_Next_Down.jpg';" onmouseup="this.src = 'images/ControlButtons_Next_Over.jpg';" style="cursor:pointer;" title="Next" /> </div> </div> <div class="w3-center" style="width:100%;"> <form name="SectionChooserForm"> <select name="SectionChooser" id="SectionChooser" onChange="goto_URL(this.form.SectionChooser);"> </select> </form><br /> <a href="https://udhr.audio" title="Home"><img src="Images/homeicon.gif" border="0" onmouseover="this.src = 'Images/homeicon_over.gif';" onmouseout="this.src = 'Images/homeicon.gif';" /></a> </div> </td> </tr> </table>这是例如，第3页的相关代码：
<table style="display:flex; align-items:center; flex-direction:column;"> <tr> <td style="text-align:center;"> <div id="sharing" style="padding-top:5px; text-align:center; width:510px; padding-left:0px;"> <a href="http://www.facebook.com/share.php?u=https://udhr.audio/UDHR_Video.asp?lng=nde&title=Amalungelo Omuntu Wonke Emhlabeni Wonke Jikelele" target="_blank"><img src="Images/Facebook_Icon.gif" title="Facebook" border="0" style="width:35px;"/></a> <a href="http://www.twitter.com/home?status=https://udhr.audio/UDHR_Video.asp?lng=nde+Amalungelo Omuntu Wonke Emhlabeni Wonke Jikelele" target="_blank"><img src="Images/Twitter_Icon.gif" title="Twitter" border="0" style="width:35px;"/></a> <a href="https://plus.google.com/share?url=https://udhr.audio/UDHR_Video.asp?lng=nde" target="_blank"><img src="Images/Google_Icon.gif" title="Google +" border="0" style="width:35px;"/></a> <a href="mailto:?subject=Amalungelo Omuntu Wonke Emhlabeni Wonke Jikelele&body=https://udhr.audio/UDHR_Video.asp?lng=nde"><img src="Images/Email_Icon.gif" title="Email" border="0" style="width:35px;"/></a> </div> <div style="font-family: Arial, Helvetica, sans-serif; width:510px; font-weight:bold; font-size:16px; text-align:center; padding-left:0px; padding-right:0px;">Amalungelo Omuntu Wonke Emhlabeni Wonke Jikelele</div> </td> </tr> </table> <table style="display:flex; align-items:center; flex-direction:column;"> <tr> <td style="text-align:center; border:solid 1px black; padding:10px; width:480px;"> <div class="w3-content" style="width:100%"> <div class="w3-animate-opacity"> <div class="Article_Title"> Isivumelwano 1 </div> <img src="Images/img_UDHR_Article_1_400px.jpg" style="bottom-margin:15px;"> <audio id="myAudio_1" src="Audio/nde/UDHR_Article1_NDE_DS.mp3"> Your browser does not support the audio element. </audio> <div class="Article_Text"> Abantu bonke bazalwa bekhululekile njalo amalungelo abo elingana. Balesipho sokucabanga lonembeza, ngakho kumele baphathane ngomoya otshengisa ubuhlobo. <br /><span style="font-size:12px; font-style:italic;">Read by Duduzile Sibanda</span> </div> <div class="w3-section"> <img src="images/ControlButtons_Prev_Up.jpg" onclick="window.location.href = 'https://udhr.audio/UDHR_Video.asp?lng=nde&p=Preamble'" onmouseover="this.src = 'images/ControlButtons_Prev_Over.jpg';" onmouseout="this.src = 'images/ControlButtons_Prev_Up.jpg';" onmousedown="this.src = 'images/ControlButtons_Prev_Down.jpg';" onmouseup="this.src = 'images/ControlButtons_Prev_Over.jpg';" style="cursor:pointer; margin-right:40px;" title="Previous" /> <img id="Pause" src="images/ControlButtons_Pause_Up.jpg" onclick="document.getElementById('myAudio_1').pause(); this.style.display = 'none'; document.getElementById('Play').style.display = 'inline';" onmouseover="this.src = 'images/ControlButtons_Pause_Over.jpg';" onmouseout="this.src = 'images/ControlButtons_Pause_Up.jpg';" onmousedown="this.src = 'images/ControlButtons_Pause_Down.jpg';" onmouseup="this.src = 'images/ControlButtons_Pause_Over.jpg';" style="cursor:pointer;" title="Pause" /> <img id="Play" src="images/ControlButtons_Play_Up.jpg" onclick="document.getElementById('myAudio_1').play(); this.style.display = 'none'; document.getElementById('Pause').style.display = 'inline';" onmouseover="this.src = 'images/ControlButtons_Play_Over.jpg';" onmouseout="this.src = 'images/ControlButtons_Play_Up.jpg';" onmousedown="this.src = 'images/ControlButtons_Play_Down.jpg';" onmouseup="this.src = 'images/ControlButtons_Play_Over.jpg';" style="cursor:pointer; display:none;" title="Play" /> <img id="Reload" src="images/ControlButtons_Reload_Up.jpg" onclick="document.getElementById('myAudio_1').play(); this.style.display = 'none'; document.getElementById('Pause').style.display = 'inline'; document.getElementById('Play').style.display = 'none';" onmouseover="this.src = 'images/ControlButtons_Reload_Over.jpg';" onmouseout="this.src = 'images/ControlButtons_Reload_Up.jpg';" onmousedown="this.src = 'images/ControlButtons_Reload_Down.jpg';" onmouseup="this.src = 'images/ControlButtons_Reload_Over.jpg';" style="cursor:pointer; display:none;" title="Play" /> <img src="images/ControlButtons_Next_Up.jpg" onclick="window.location.href = 'https://udhr.audio/UDHR_Video.asp?lng=nde&p=2'" onmouseover="this.src = 'images/ControlButtons_Next_Over.jpg';" onmouseout="this.src = 'images/ControlButtons_Next_Up.jpg';" onmousedown="this.src = 'images/ControlButtons_Next_Down.jpg';" onmouseup="this.src = 'images/ControlButtons_Next_Over.jpg';" style="cursor:pointer; margin-left:40px;" title="Next" /> </div> </div> </div> <div class="w3-center" style="width:100%;"> <form name="SectionChooserForm"> <select name="SectionChooser" id="SectionChooser" onChange="goto_URL(this.form.SectionChooser);"> </select> </form><br /> <a href="https://udhr.audio" title="Home"><img src="Images/homeicon.gif" border="0" onmouseover="this.src = 'Images/homeicon_over.gif';" onmouseout="this.src = 'Images/homeicon.gif';" /></a> </div> </td> </tr> </table>只是第一页封面没有对齐。感谢您的光临！
需要认真的健全性检查...我看不出为什么这两页没有对齐（居中）。我将不胜感激。页面1：https://udhr.audio/UDHR_Video.asp?lng=nde页面2：...
未对齐的原因从未明确，但我通过动态调整第1页上的div容器的填充找到了解决方法。