居中填充剩余面积的液体格子

Question

我需要重新审视下一个问题，因为我完全陷入了困境（我已经尝试了很多 - 表格，背景，之前和之后，表格单元格显示，但没有收到任何好的）。

我有固定宽度“包装”（例如1000px）的div。 然后我有内在的建设：线，按钮，文本，按钮，线。 按钮具有固定的宽度，但文本没有。所以，可能会出现下列情况：

1：-------------------- < Some text> ------------ --------

2：---------------------- < Nope> ----------- ------------

3：-------------- <里面的大内文> ------------ -

正如您所看到的，文字应始终位于中央，但从左侧和右侧的这些行应从左侧和右侧填充剩余区域。

是否可以在css中做？或仅与jQuery？

感谢您的帮助。 会很高兴的任何链接和提示）

Answer 1

试试这个。
CSS

p{position:relative;text-align: center;} 
    p:after{ 
    content:''; 
    position:absolute; 
    top: 50%; 
    width: 100%; 
    left: 0; 
    border-top:1px dashed #000; 
    z-index: 1; 
    } 
    p span{ 
    display: inline-block; 
    background: #fff; 
    position: relative; 
    z-index: 2; 
    padding: 0 10px; 
    } 

HTML： <p><span>asdadasdas</span></p>