Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS: min-height and vertical-align:middle

Tags:

css

html-table

How to force min-height and vertical-align:middle to work for td element or it's inner element?

like image 940
Somebody Avatar asked Apr 15 '11 10:04

Somebody


People also ask

How do I center something vertically in CSS?

To center both vertically and horizontally, use padding and text-align: center : I am vertically and horizontally centered.

How do I vertically align text in the middle of a div?

Using the Line-Height Property In most cases, you can also center text vertically in a div by setting the line-height property with a value that is equal to the container element's height.


2 Answers

The height on a td element is the equivalent of min-height, as a table cell will always stretch if required - but note that, especially in a complex table, that setting heights on table rows is a tricky, often impossible, process, browsers have a great deal of leeway in how they render tables and will often make a "judgement call"

td {  height: 100px;  vertical-align:middle; } 
like image 168
clairesuzy Avatar answered Oct 01 '22 18:10

clairesuzy


You can always put a div inside the td and put the css rules in the div...

like image 29
user1875280 Avatar answered Oct 01 '22 20:10

user1875280