I have to put a text box of fixed height where the text is aligning below if the text is greater than the height of the box, the text Will not be visible. My problem is now that overflow: is hidden; Do not hide additional text I think this
display: table-cell; is due to. If I
display: table-cell; overflow: hidden; works, then
vertical-align: bottom; will not work. P>
Edit: If the text is too long, the text does not need to be expanded up until it reaches 40px. When it reaches 40px, additional text
overflow: hidden .
div {background: yellow; Height: 40px; Width: 250px; Exhibit: Table-Cell; Vertical-alignment: bottom; Hidden flurry; } & Lt; Div & gt; & Lt; A href = "#" & gt; A short link with my text & lt; / A & gt; & Lt; / Div & gt; & Lt; Br> & Lt; Div & gt; & Lt; A href = "#" & gt; A lot ... very long links with my text & lt; / A & gt; & Lt; / Div & gt;
HTML
& lt; Div class = "out" & gt; & Lt; Div class = "insideside" & gt; & Lt; A href = "#" & gt; A short link with my text & lt; / A & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Br> & Lt; Div class = "out" & gt; & Lt; Div class = "insideside" & gt; & Lt; A href = "#" & gt; My text and lieutenant; / A & gt; Very very very very very very very very very link with; & Lt; / Div & gt; & Lt; / Div & gt; In CSS
.outout {background: yellow; Height: 40px; Width: 250px; Hidden flurry; }. Geneside {height: 40px; Exhibit: Table-Cell; Vertical-alignment: bottom; } Hope this will help you ...
You can do the same thing without editing the HTML code < P> HTML: the same HTML code
CSS: like this
div {background: yellow; Height: 40px; Width: 250px; Hidden flurry; } A {display: table-cell; Height: 40px; Vertical-alignment: bottom; } Perhaps this will solve your problem ...
No comments:
Post a Comment