Float Left with auto width，如果短，则跳转到下一行 [英] Float Left with auto width, jumps to next line if short
问题描述
我又回来了，
简介：
我有一个固定宽度的浮动div（outerDIV）包含一个图像（IMG）和一个包含短文本的div（innerDIV）
问题：
在FF中，innerDIV显示在IMG，因为outerDIV不够宽，无法包含它们（在某些情况下）。在outerDIV很宽的情况下，我没有这个问题。
IE包装文本但仍然保持在IMG的右侧。 FF没有包裹它并把它放在图像下面的线上。这对我不起作用，因为outerDIV是一个固定的高度，你看不到文字。 （溢出：隐藏）。它太短，太难看，无法添加垂直滚动（溢出：自动）。
问题：
如何让innerDIV浮动到图像的右边并包裹在自身内而不是在图像下跳转？ （他们都漂浮着：离开;）
我的代码此时：
I''m back again,
Intro:
I''ve got a floating div (outerDIV) with fixed width that contains an image (IMG) and a div that contains a short text (innerDIV)
Problem:
In FF, the innerDIV is displaying under the IMG because outerDIV is not wide enough to contain both of them (in some instances). In the instances where the outerDIV is wide, I don''t have this problem.
IE wraps the text but still keeps it to the right of the IMG. FF doesn''t wraps it and puts it on the line below the image. This doesn''t work for me because the outerDIV is a fixed height and you can''t see the text. (overflow: hidden). Its too short and too ugly to add a vertical scroll (overflow: auto).
Question:
How do I make the innerDIV float to the right of the image and wrap within itself instead of jump under the image? (They''re all float:left;)
My Code at this time:
推荐答案
我最近也遇到过这个问题。我如何修复它是使用负边距。在我的问题中，我把所有东西放在一个div中，因此留下了一个边距 - 与我的img的宽度相同（以便文本被移动），然后为img'做了一个负余量。这就是我的css中的所有内容：
I have recently run into this problem as well. How I have fixed it is using negative margins. In my problem I had everything in one div and so made a margin-left same size as the width of my img (so that text is moved over) and then made a negative margin for img''s. This is all that it is in my css:
I ''再回来
I''m back again
这很好。我想。
That''s nice. I guess.
问题：
如何让innerDIV浮动到图像的右侧在自己内部包裹而不是在图像下跳跃？ （他们都是浮动的：左;）
Question:
How do I make the innerDIV float to the right of the image and wrap within itself instead of jump under the image? (They''re all float:left;)
将页面放在公共服务器上并在论坛的帖子中提供可点击的链接可能是一个很好的触摸。或者，它可以吗？
Putting the page on a public server and providing a clickable link to it in your post to the forum could be a nice touch. Or, could it?
如果其他所有方法都失败，我会尝试负余量。
我不能相信没有有效的，非黑客的方法来做到这一点。我的代码通过了XHTML Transitional W3C验证。除了< div>之外，我不介意将结构更改为其他内容。并按此顺序。我只需要外部元素以固定宽度向左浮动。
@David Laakso
这是一个内部网应用程序，抱歉。专有信息。
我想我提供的不仅仅是普通的OP''er。我有清晰的部分，代码和截图。
其余的我不能依法给你，否则我愿意。
Dan
I''ll try the negative margin if all else fails.
I can''t believe that there isn''t a valid, non-hack way to do this. My code passes XHTML Transitional W3C Validation. I don''t mind changing the structure to other things besides <div> and in that order. I just need the outer element to float left with fixed width.
@David Laakso
This is an intranet application, sorry. Proprietary information.
I think I provided much more than the common OP''er. I''ve got clear cut sections, code, AND a screenshot.
The rest I can''t give you by law, otherwise I would.
Dan
这篇关于Float Left with auto width，如果短，则跳转到下一行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
