我想并排放置两个DIV标签而不使用固定宽度。第一个div扩展到其内容,第二个div应该填充剩余的空间。另外,div不能位于另一个div的顶部,因为它们具有透明的背景图像,因此如果它们相交,则很明显。我尝试了所有可以考虑的可能性,但是找不到使用DIV标签的解决方案。
我可以使用TABLE进行此操作,但是可以使用DIV进行吗?还是DIV不能再做的一件事?
这是代码:
#right{ background: green; width: 100%; } #left { margin-top: 5px; /* to test if they intersect*/ background: red; } #container { width: 800px; } <div id="container"> <div id="left"> This div is as big as it's content</div> <div id="right"> rest of space</div> </div>
感谢您的答复!
background: #aaa; float: left } #right { background: cyan; overflow: hidden }
这适用于所有现代浏览器和IE7 +。
左列将与其中的内容完全一样宽。右列将占用剩余空间。