使用alignleft格式化段落，alignright

我试图让图片左侧的“我们是谁”部分。然而，“团队见面”部分不断出现，原因不明。此外，我不知道为什么，但“团队合作”部分分成两半;一段位于图片旁边，另一段位于“我们是谁”部分下方。使用alignleft格式化段落，alignright

HTML

<img src="http://i.imgur.com/Z9V9vWz.jpg" width="312" height="274" class="alignright"> 
<div class="team-bio alignleft"> 
    <h2>Who Are We?</h2> 
    <p>Company Name is lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna.</p> 
    <p>Company Name is lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna.</p> 
    <p>Company Name is lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna.</p> 
</div> 

<div class="single-bios"> 
    <h2>Meet the Team</h2> 
    <div class="james-bio">James is lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt.</div> 
    <div class="jason-bio">Jason is lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt.</div> 
</div>

CSS

.alignright { 
display: inline; 
float: right; 
margin-left: 1.5em; 
} 

.alignleft { 
display: inline; 
float: left; 
margin-right: 1.5em; 
}

来源

2014-12-03 J82

图像已经是内联元素，所以删除该样式。原因是由于清算。查看浮动和清除，或浮动基本知识。 – Christina 2014-12-03 23:20:28

.alignleft { 

display: inline; 
margin-right: 1.5em;  
}

请试试这个。希望是会帮助你的。

来源

2014-12-03 23:27:13

在这种情况下绝对没有必要使用float：left。如果你完全取出浮法：左边的问题应该是固定的。

来源

2014-12-03 23:27:40

使用alignleft格式化段落，alignright

回答

相关问题