Home » questions » How do I prevent my HTML table cell from expanding vertically?

How do I prevent my HTML table cell from expanding vertically?

3
2006-08-02 06:27:10, Category: Programming & Design
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.

Answers

  1. Joey

    On 2006-08-02 07:14:06


    "inside your cell wrap all the content inside of this:
    so ull end up with:
    a bunch of content
    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

  2. IrishTek

    On 2006-08-02 06:33:36


    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.

  3. Arkangyle

    On 2006-08-02 06:48:24


    Width you can lock, but I don't know of any way to define a static height per the rules of HTML tables. You could, through a bit of effort, do this programatically. I presume you're keeping each day's entry data somewhere else ... populate the day with no more than it can hold on creation (PHP would be good for this) and enable an onmouseover event to display the full set of entries.