------------- -------------------------------------------------- | some text | | some more text,sometimes more,sometimes less | ------------- -------------------------------------------------- |<------------------------- 100% width ----------------------->|
所以我有上面的布局.左框应该始终尽可能小,而右框应占用剩余空间.这通常是漂浮的:左边.
问题是,右边的盒子可以增长很多,而左边的盒子几乎保证非常小(但是尺寸不同,所以需要灵活).如果右框增长,我需要这样做:
------------- -------------------------------------------------- | some text | | quite a lot of text,actually,really quite a | ------------- | bunch of it,you could say this is really | | quite a heck of a lot of text | --------------------------------------------------
如果我使用一个float:left,如果它包含很多文本,那么右边的框会在左边的框中进行换行:
------------- | some text | (not good) ------------- ---------------------------------------------------------------- | quite a lot of text,really quite a bunch of it,| | you could say this is really quite a heck of a lot of text | ----------------------------------------------------------------
如果我同时使用一个表,如果两者都包含很少的文本,则左框可能会不必要地增长:
(not good) -------------------------------- ------------------------------- | some text | | not that much text | -------------------------------- -------------------------------
此外,左框不应该断线.但是由于它包含了一些HTML元素,而不仅仅是纯文本,所以在所有浏览器中都不能使用no-wrap.
这个问题有什么好的解决方案?
编辑
右边框占用剩余的宽度并不是非常重要,只是它始终保持在左边框的右侧.