CSS div無內容擴展

我目前正在一個新的網站上工作，我遇到了問題。我有2 div的旁邊eachother，一個內容和一個背景圖像。CSS div無內容擴展

與內容的DIV是媒體鏈接自動在它的內容現在

擴大，一個與背景圖像僅僅是設計，在它裏面沒有任何內容，我希望它與一個全自動擴大與內容，所以他們都有相同的高度。

這裏有2個截圖讓我的問題更加清晰。

HTML：

 <div id="bubble"> 
      Stad Turnhout 
     </div> 

     <div id="date"> 
      <span class="created">created</span><br/><span class="date">okt<br/>2011</span> 
     </div> 

    </div> 

    <div id="slash"> 
    </div> 

    <div class="textfield"> 
     <p class="text"> 
      Text goes in here 
     </p> 

    </div>

CSS：

#slash { 
float:left; 
width:20px; 
height:auto; 
background:url(images/slash.jpg) no-repeat, url(images/socialbg.jpg) repeat;} 


.textfield { 
padding:25px; 
width:269px; 
height:auto; 
float:right; 
background:url(images/point.jpg) no-repeat, #FFF;}

我一直想幾件事情，並試圖找到對谷歌的東西，但沒有是有用的。任何想法如何解決這個HTML/CSS？

感謝

編輯：加入我的代碼

來源

2012-09-10 Jrn

告訴我們您的HTML/CSS – krish

向我們展示你的HTML和CSS或創建的jsfiddle演示 – Champ

檢查此頁面http：//www.w3schools .com/css/tryit.asp？文件名= trycss_background_shorthand2 – 2012-09-10 12:29:50

有使兩個並排的DIV總是相同的高度和擴張沒有真正的方法。你可以給這兩個元素一個父包裝，然後在該包裝上設置一個高度，然後給這兩個子div 100％的高度。它們的高度將由包裝機的固定高度控制。

HTML：

<div class="wrapper"> 
     <div id="slash"></div> 

     <div class="textfield"> 
      <p class="text"> 
       Text goes in here 
      </p>  
     </div> 
    </div>

CSS：

.wrapper { 
     height: 350px; 
    } 
    #slash, .textfield { 
     height: 100% 
    }

來源

2012-09-10 12:40:58

感謝您的答案燉，但其工作不正常。我找到了解決方案，但我似乎無法將其實施到我的代碼 http://jsfiddle.net/9sVKJ/ – Jrn

我已經得到它的工作。對於有同樣問題的人，請檢查： http://jsfiddle.net/9sVKJ/ – Jrn

CSS div無內容擴展

回答

相關問題