我有一个模板应用于我网站上的多个页面,包括“关于”部分。此部分有三个页面,每个页面的布局相同。该模板无法在两个页面上正常工作,即about2.html和about1.html。奇怪的是,它适用于about3.html
以前这两个页面在我查看过的所有浏览器上运行正常,但最近才发现它已经停止正常显示,即使我没有触及模板或CSS。
这是其中一个页面: http://thehummingbirdplace.com/about2.html
我尝试重新排列不同的元素,禁用某些CSS,并一起删除部分,但它没有修复页面。当我删除整个.adRight部分或禁用其上的浮动时,文本会移回到顶部,但菜单选项卡不会向右排列。老实说,我不确定问题的根源是什么,因此我无法在此提供具体代码以供关注。
答案 0 :(得分:1)
css
和about1.html
内的about2.html
应如下所示
<style style="text/css">
img { padding-top: 0px; padding-right: 15px; padding-bottom: 15px; padding-left: 0px; }
#text { width: 850px; margin-left: auto; margin-right: auto; }
.img-left { flaot:left; }
.img-right { flaot:right; }
</style>
接下来,您可以清除这两个文件divs
上的clear
课程 - 您不需要它们,或至少将您的.clear
课程更改为此.clear { clear: both; }
1}}
<div id="header"><!-- ... --></div>
<div id="adLeft"><!-- ... --></div>
<div class="clear"></div> <!-- take this off -->
<div id="adRight"><!-- ... --></div>
<div class="clear"></div> <!-- take this off -->
<div id="content1"><!-- ... --></div>
<div id="footerLine1"></div>
<div id="footer"><!-- ... --></div>
将about1.html
中文本块内唯一的img元素更改为此
<img src="_images/Donna4.png" width="197" height="193" alt="Donna Wright" class="img-left" />
将about2.html
中文本块内唯一的img元素更改为此
<img src="_images/hummingbirdLogo.png" width="208" height="145" alt="The Hummingbird Place Logo" class="img-right;">