如何使居中的 div 具有动态大小(文本)并且它的侧面 div 可见而不指示其大小?
div“文本”没有大小,只有向上和聚焦。 侧面 div(bg-bg-left 和 right)应该是可见的并且宽度是自动的。
HTML:
<div class="cont">
<div class="bg-left">The width should be automatic.</div>
<div class="text">This text should be centered and may increase the width.</div>
<div class="bg-right">The width should be automatic.</div>
</div>
CSS:
.cont{ width:500px; height:15px; background:purple;}
.bg-left { float:left; width:50px; height:15px; background:red; }
.text { float:left; height:15px; max-width:200px; background:green; white-space:nowrap; }
.bg-right { float:left; width:50px; height:15px; background:red; }
最佳答案
不用 float ,您可以使用表格显示轻松地做到这一点:
.cont{display:table; width:500px; height:15px; background:purple;}
.bg-left { display:table-cell; width:50px; height:15px; background:red; }
.text { display:table-cell; height:15px; max-width:200px; background:green; white-space:nowrap; }
.bg-right { display:table-cell; width:50px; height:15px; background:red; }
关于css - 如何使居中的 div 具有动态大小(文本)并且其侧面 div 可见而不指示其大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22245686/