Zach
Zach

Reputation: 27

How to prevent CSS table-cell content expanding to full height of row

How do I keep an item (toggle styled checkbox in my case) from expanding to the full height of a table cell.

You can see my problem here: http://cdpn.io/scqev

When my styled checkbox is the tallest thing in the row it works fine, but when another cell expand from wraped text, the styled checkbox also expands instead of remaining the height set in the CSS.

I prefer to keep the table layout because I need my labels vertically aligned to the middle and I need the toggle switches all aligned to the right. If the expected output can be achieved with floats or something else that is fine.

Thanks for the help!

Upvotes: 0

Views: 2589

Answers (2)

Jared
Jared

Reputation: 471

Have you tried making a div inside that input? Making the div 64 px x 32 px?

Upvotes: 0

user2282732
user2282732

Reputation:

Just adding display: block; to it works fine for me.

Upvotes: 1

Related Questions