html css与屏幕同宽,html – CSS div与其内容一样宽

我还是一个CSS新手.多年来,我使用嵌套表管理我的布局,我知道所有的CSS人都会告诉我是邪恶的.我已经用CSS多年了,但从一开始我一直无法按照我想要的方式控制我的布局.

简而言之,我想要的是< div>那只会和它的内容一样宽.我不想设置它的大小.我希望它的内容与动态创建的内容一样宽泛.

一个表完美地完成了.使用< div>它似乎总是像我想要的那样做.没有我想要的“溢出”选项.

典型的例子是当我想创建一个全页的柱状布局时,左列包含导航链接,右边包含内容.我希望左栏与导航链接一样宽.不多不少. (导航链接不是静态的,它们是动态创建的,可以随时改变大小/长度).而右(“内容”)列应该是剩下的.最重要的是,当我使浏览器屏幕更宽或更窄时,我希望左侧列可以与导航链接完全一样宽：没有更多,更少.如果浏览器的宽度太窄,我希望内容根据需要自动换行.在任何情况下,我不希望文本被遮蔽或者不在定义的列之外.

简而言之,我想要一个< div>这个工作以及一个表,而不必使用一个表.当然,CSS专家.这可以做….对吧？我在其他论坛上提到过这个问题,从未收到过可接受的答案.

或者采取一些有点简单的例子(可能这个很简单)：

• one
• two
• three

整个过程与浏览器屏幕一样宽泛.但是我希望它只能和最长的元素一样宽.如何使用CSS？我可以把整个东西放在这样的桌子里面

one two three

…它做我想要的如何使用CSS而不是使用这些“恶”表呢？

我试过miku的例子.

它不工作(为了我想要它做).

如果我做了超长的导航线,就像长串

an&nbps;extra&nbps;long&nbps;navigation&nbps;link&nbps;goes&nbps;here&nbps;-&nbps;this&nbps;could&nbps;even&nbps;be&nbps;an&nbps;image!

我想让左侧的导航面根据需要展开.我不想要最大宽度.

使用上面的例子,额外的长行将被“main”div遮蔽.

此外,“main”div应该是浏览器宽度的其余部分,在这种情况下,它的宽度只能与文本的宽度一样宽.