How do I prevent my HTML table cell from expanding vertically?
I'm creating a HTML table that is full screen (calendar) and sometimes I have rows in a day cell that are more than can be displayed in the cell without it growing. But I don't want the cell to grow, I'd like it to truncate and then on mouseover, then it can show the full day's entries. Is this possible? And code sample will be super appreciated!
I'm happy to use javascript and CSS.
Public Comments
- You can set the height attribute of the table cell. The problem you'll run into is that browsers assume you are making a mistake when you put in more text than will fit in a cell and show all the text, creates a horrible table distortion. Also keep in mind that web design is to allow the vertical to expand and the horizontal be defined, and this is how browsers support excess data in a table cell. in short, with html alone you won't be able to do what you want.
- "inside your cell wrap all the content inside of this: <div style="height:90px; overflow:hidden;"></div> so ull end up with: <td> <div style="height:90px; overflow:hidden;"> a bunch of content </div> </td> play with the height and u should be golden. this css trick will cut off anything that goes beyond ur set height. ps- sorry for the weird code positions yahoos formatting gets me everytime
Powered by Yahoo! Answers