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內動態調整大小的元素

回答

相關問題