如何用css中的文字量增長高度？

我這種情況如何用css中的文字量增長高度？

<div class="sub_project"> 
    <div class="sbone brown_gradient optzeci">Description</div> 
    <div class="sbtwo optzecitwo"> 
    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. 
    </div> 
</div>

.sub_project{ 
    font-size: 16px; 
    margin: 10px 0; 
    background: #D7D7D7; 
} 

.brown_gradient{ 
    background: #EB994F; 
} 
.sbone{ 
    padding: 5px; 
    color: white; 
    float: left; 
    width: 160px; 
    margin: 0 10px 0 0; 

} 

.sbtwo{padding: 5px;} 

.optzeci{height: 80px;} 
.optzecitwo{min-height: 80px;} * html .optzeci { height:80px; }

我想<div class="sbone brown_gradient optzeci">Description</div>高度與文本的數量增長。

現在我設置min-height: 80px;但我不想設置高度。

此外，我不希望使用圖片或JavaScript

見jsfiddle

什麼想法？

感謝

來源

2012-02-03 Patrioticcow

「現在我設置了'最小高度：80px;'但是我do't要設置高度的。」那就不要。 – BoltClock 2012-02-03 18:54:57

爲什麼你需要設置一個高度呢？如果你只是刪除高度屬性，你試圖達到什麼不起作用？ – Tom 2012-02-03 18:55:49

我相信你會爲此需要JavaScript。你爲什麼不想使用JavaScript？ – 2012-02-03 18:58:21

相對位置上的容器，.sub_project，並給它留下的填充。絕對位置.optzeci並給它top: 0; left: 0; bottom: 0;。

http://jsfiddle.net/W7Nrn/9/

.sub_project { 
    ... 
    padding-left: 175px; 
    position: relative; 
} 
.optzeci { 
    position: absolute; 
    top: 0; 
    left: 0; 
    bottom: 0; 
}

來源

2012-02-03 19:11:00 gilly3

謝謝，看起來不錯 – Patrioticcow 2012-02-03 19:12:25

，如果你可以使用jQuery的，那麼你可以指定高度，對飛行箱。你只需要在包含你的文本的div上獲得高度，然後爲描述框指定相同的高度。

這裏是我的嘗試：http://jsfiddle.net/W7Nrn/6/

來源

2012-02-03 19:07:23

也感謝回答，可能會在一天之內出現，但是這樣做的人找不到javascript – Patrioticcow 2012-02-03 19:16:57

@Lokesh - 那麼您還需要添加一個'window.onresize'處理程序，因爲內容的高度會隨着更改窗戶的寬度。 – gilly3 2012-02-03 19:16:58

@ gilly3：你是對的先生:)你的方法來解決這個問題與CSS是更容易然後JavaScript。 – 2012-02-03 19:21:06

如何用css中的文字量增長高度？

回答

相關問題