Fixed size of div element

Question

I am trying to create a div element with fixed size in html. My problem is, the above div receives input text from backbone. The size of text is unknown, so every time that the transmitted text is big, automatically the size of the div is change. How is it possible to display only the first words of the text that fit in the predefined bounding box of the div???

My css code

.hashTagsCloud {
 max-width: 500px;
 max-height: 400px;
overflow: hidden;
}

And html code:

                <div class= "hashTagsCloud span4 offset1 "> //bootstrap             
                 <div id="profiles> //backbone view
                    <script id="profileTemplate"  type="text/template">//backbone template
                    </script>
                 </div>
                </div>

I take data with getElementById.

Answer 1

在Div元素的CSS中，您可以使用

overflow: hidden

Answer 2

you can use from this text-overflow: ellipsis; of css, check this

Answer 3

You can use the overflow: hidden; property, granted that you set a width and height on the div already.

<style type='text/css'>
.text { 
  width: 100px;
  height: 18px;
  overflow: hidden;
  white-space: pre-line; /* breaks up the text on spaces before hiding */
}
</style>
<div class='text'>some really really really long text</div>