图像和文字在同一条线上？

Question

这让我很头疼......

我试图在左边有一个固定高度/宽度的图像,在右边有一个文本,当然在同一行.整个容器的动态宽度为视口的90%,这意味着右侧的文本也将具有动态宽度(90% - 图像宽度),因为左侧的图像是固定的.文本需要左对齐,因此"float:right"将不起作用.我已经尝试了无数浮子,对齐,表格单元等的组合,没有任何作用......我最接近的是它们在同一条线上,但文本被强制对齐到右边.

我的意思是:http://i.imgur.com/QRDhLro.png

#container {
overflow:hidden;
position:relative;
width:90%;
min-width:800px;
margin-bottom:20px;
margin-top:20px;
margin-left:auto;
margin-right:auto;
}
.leftimage {
width:600px;
height:100px;
}
.righttext {    
float:right;
}

...
...

<div id="container">

    <div class="righttext">lorem ipsum lorem ipsum <br> lorem ipsum lorem ipsum </div>

    <div class="leftimage"><img src="../pictures/test.png"></div>

</div>

Answer 1

移动

<div class="righttext">lorem ipsum lorem ipsum <br> lorem ipsum lorem ipsum </div>

后

<div class="leftimage"><img src="../pictures/test.png"></div>

CSS:

.righttext{
    float: none;
    margin-left: 600px;
}