DIV内动态调整大小的元素

中心元素是我无法预测宽度的动态文本。文本在DIV中水平居中。 DIV具有固定大小。

我想左边的元素被锚定到左边并流动直到它到达文本;同样地，右元件应该开始只是文本和终点在DIV结束后（右：0或东西）

最终的结果是这样的：

111111 my-text 222222 

1111 longer-text 2222

宽度的总和总是加起来到DIV的宽度，左边元素的大小等于右边元素的大小。

任何不错的方法来做到这一点？

编辑：

我想只有两种方法是使用javascript或表。我用表，它工作正常。

div 
{ 
    display: table; 
} 

#111, #222 
{ 
    width: 100%; 
    display: table-cell; 
}

来源

2012-01-02 AlexG

这是什么最终目标？解决这个问题的方法可能会更好。 – 2012-01-02 20:33:44

右侧和左侧元素的大小是否固定？ – andrewk 2012-01-02 20:37:49

不幸的是，他们不是。最终目标是在其左侧和右侧有一个居中的文字和一些装饰（装饰是不同的），也许是一些SVG矩形或类似的。 – AlexG 2012-01-03 00:18:53

您应该能够给出中心元素宽度：100％;和text-align：center;

来源

2012-01-02 20:29:41 Asty

其他元素呢？他们不是固定的大小，他们必须填补剩下的空间。 – AlexG 2012-01-03 00:18:04

也许？

<div style="width:500px;border:1px solid #000;"> 

<span>1111</span> 
<span style="text-align:center">dynamic text</span> 

<span style="text-align:right; float:right;">2222</span> 

</div>

来源

2012-01-02 20:35:38 justinlabenne

DIV内动态调整大小的元素

回答

相关问题