Html 浮动元素'；s文本，因为没有设置宽度
我正在使用twitter-bootstrap.css和angularjs开发一个响应迅速的移动网页 我正在尝试使用浮动概念将一个图像和文本并排放置在一行中。请参见下面的屏幕截图 我给图像加了宽度，但没有给文本加宽度，因为我想让文本取图像留下的剩余宽度 但事实并非如此，当文本大于图像的宽度时，文本将转到下一行，而不是换行到图像遗漏的可用宽度 屏幕截图#1 当文本包含在图像遗漏的宽度内时，当文本内容的宽度小于图像遗漏的可用宽度时 屏幕截图#2 当文本到达新行而不是在图像留下的宽度内换行时，当文本内容的宽度大于图像留下的可用宽度时 屏幕截图#3 正如我所需要的，当文本在图像留下的宽度内换行时，当文本内容的宽度大于图像留下的可用宽度时。但宽度是为文本设置的 我的代码是Html 浮动元素'；s文本，因为没有设置宽度,html,css,twitter-bootstrap,responsive-design,Html,Css,Twitter Bootstrap,Responsive Design,我正在使用twitter-bootstrap.css和angularjs开发一个响应迅速的移动网页 我正在尝试使用浮动概念将一个图像和文本并排放置在一行中。请参见下面的屏幕截图 我给图像加了宽度，但没有给文本加宽度，因为我想让文本取图像留下的剩余宽度 但事实并非如此，当文本大于图像的宽度时，文本将转到下一行，而不是换行到图像遗漏的可用宽度 屏幕截图#1 当文本包含在图像遗漏的宽度内时，当文本内容的宽度小于图像遗漏的可用宽度时 屏幕截图#2 当文本到达新行而不是在图像留下的宽度内换行时，当文本
<html lang="en" ng-app>
<head>
<meta charset="utf-8">
<title>My HTML File</title>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/bootstrap-responsive.css">
<style>
.float-left {float:left !important;}
.clearIt {clear:both !important;}
.marRight5{margin-right:5px}
.BgImg{background: url(images/img.png) no-repeat;height:25px;width:25px}
</style>
<script src="lib/angular/angular.js"></script>
</head>
<body>
<div class="row-fluid">
<div class="BgImg float-left marRight5"></div>
<div class=" float-left">This is test content This is test content This is test content This is test content This is test content</div>
<div class="clear"></div>
</div>
</body>
</html>
我的HTML文件
.float left{float:left！重要；}
.clearIt{clear:两者都有！重要；}
.marRight5{右边距：5px}
.BgImg{背景：url（images/img.png）不重复；高度：25px；宽度：25px}
这是测试内容这是测试内容这是测试内容这是测试内容这是测试内容
这是测试内容这是测试内容这是测试内容这是测试内容这是测试内容
<div class="row-fluid">
<div class="BgImg float-left marRight5"></div>
<div>This is test content This is test content This is test content This is test content This is test content</div>
<div class="clear"></div>
</div>