HTML段落格式问题

Question

所以我有这一块的html：

<div id="navigation"> 
    <img class="navLogo" src="images/navlogo.png" /> 
    <h3 class="navTalk">Routes and Maps</h3> <br /> 
    <p class="navtext">Get routes, stop times,and maps</p> 
</div> 
<div id="fares"> 
    <img class="navLogo" src="#" /> 
    <h3 class="navTalk">Fares & Costs</h3> 
    <p>Get info on fares and trip costs</p> 
</div> 
<div id="alerts"> 
    <img class="navLogo" src="#" /> 
    <h3 class="navTalk">Service Alerts</h3> 
    <p>Find disruptions and delays</p> 

</div> 

有了这个CSS：

#navigation { 
float: left; 
border: 1px solid black; 
background-color: #d69f0f; 
margin-left: 50px; 
padding: 2px; 
margin-bottom: 10px; 
width: 210px; 

} 
#fares { 
float: left; 
border: 1px solid black; 
background-color: red; 
margin-left: 50px; 
padding: 2px; 
margin-bottom: 10px; 
width: 200px; 
} 
#alerts { 
float: left; 
border: 1px solid black; 
background-color: red; 
margin-left: 50px; 
padding: 2px; 
width: 200px; 
} 
#navigation h3 { 
color: #fff; 
} 
#navigation p { 
font-size: 8pt; 
color: #fff; 
padding-left: 4px; 
} 
#fares p { 
font-size: 8pt; 
color: #fff; 
} 
#fares h3 { 
color: #fff; 
} 
#alerts p { 
font-size: 8pt; 
color: #fff; 
} 
#alerts h3 { 
color: #fff; 
} 
#tripplanner { 
float: left; 
} 

一切看起来都像我期望它看起来，除了一段不启动h3标签下方的行。相反，该段在h3之后开始，并换行到下一行。我似乎也无法让段落接受填充，并且它正在向右推动我正在使用的图标的右侧。我完全丧失了为什么会发生这种情况。我确定有一个简单的解决方案，但我迷路了。任何帮助将不胜感激。

Answer 1

删除BREAK标签：

<h3 class="navTalk">Routes and Maps</h3> <br /> < ---在这里。