我有一个网页:http://jsfiddle.net/KM9HJ/
<!DOCTYPE html />
<head>
<title>Home</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="logo">
<img style="width:50; height:50; float:left;" src="Content/Portal%20Layered.png"/>
<img style="width:50; height:50; position:relative; left:-50px; z-index:2;" src="Content/Blank.png"/>
<div><h2 id="headerh2">Cody Shearer</h2></div>
</div>
<div id="wrapper">
<div style="background-color:#565656">
<div id="links"><a href="Home.htm" class="Home" id="link">HOME</a></div>
<div id="links"><a href="About%20Me.htm" class="AboutMe" id="link">ABOUT ME</a></div>
<div id="links"><a href="Gallery.htm" class="Gallery" id="link">GALLERY</a></div>
</div>
<article id="para">
<p>About This Website</p>
<div id="paraL2"><p>About this page:</p> <div id="paraP">This is</div></div></article>
</div>
</body>
如果你看看“关于这个页面:”的div,你会看到它位于div的最右边,而它的一部分被切断了(你可能需要调整结果区域的大小才能看到这个)。我想要的话就是留在一条线上并与左边对齐。从我所看到的问题可以通过从#links区域删除“float:left”来解决,或者通过删除“width:150px;”可以稍微帮助一下。来自#link。唯一的问题是我花了很长时间试图获得其他的
答案 0 :(得分:6)
添加明确:左可能对您有帮助。
#para {
clear:left;
....