如何爲元素設置寬度自動

我有3個div標籤。如何爲元素設置寬度自動

<div id="thread"> 
      <div id="left-panel" style="width: auto;">a</div> 
      <div id="content" style="width:1024px; margin: auto;">c</div> 
      <div id="right-panel" style="width: auto">b</div> 
</div>

我想div#left-panel，div#right-panel在線與div#content。 Div#left-panel和div#right-panel屏幕分辨率更改時的自動寬度。

請幫幫我！

來源

2013-04-10 vinhnguyen

使用[網格系統]（http://960.gs/），以免重新發明輪子:) – epoch 2013-04-10 11:38:31

您是否考慮過CSS媒體查詢？（確保把元標記的頭）

<meta name = "viewport" content = "width=device-width, initial-scale=1.0"> 

@media(min-width: 1024px) { 
    #content {} 
    #left-panel {} 
    #right-panel {} 
} 

@media(max-width: 1023px) { 
    #content {} 
    #left-panel {} 
    #right-panel {} 
}

來源

2013-04-10 11:39:02 Stefan

對於當前的標記加上你的CSS組合，你不能水平對齊你的三個div的。

有一條規則，您必須遵循，以便水平對齊您的div。

(Total(width + margin + padding) of divs to be horizontally aligned) 
        <= Total width of the Parent Container.

現在，你想覆蓋整個橫屏寬度（沒有水平滾動條），那麼你可以給百分比寬度到您的div和float:left他們即

 <div id="thread" style="width: 100%;"> 
      <div id="left-panel" style="width: 10%">a</div> 
      <div id="content" style="width:78%;">c</div> 
      <div id="right-panel" style="width: 10%">b</div> 
     </div>

看到這個demo

來源

2013-04-10 11:41:05

<div id="thread" style="float:left;width:100%"> 
      <div id="left-panel" style="width:10%;float:left">a</div> 
      <div id="content" style="width:70%;float:left;">c</div> 
      <div id="right-panel" style="width: 20%">b</div> 
</div>

來源

2013-04-10 11:45:47

如何爲元素設置寬度自動

回答

相關問題