CODEWITHSUNDEEP
htmlcsshtml-table
devirkahan
devirkahan

Reputation: 460

How to force text in an HTML table to start at a certain distance from the top of the cell

Right now, I have the side, and top and bottom padding set, but while that is the same for each cell, when there is more text in the one cell, the height at which the text starts is different based on how much text there is. What should I be doing so that the text starts at the same distance from the top of the cell regardless of the amount of text, and then pushes down from there? So that I end up with something like this:

http://cl . ly/WoRh

as opposed to something like this:

http://cl . ly/Wol0

Current code:

.bottom-table td {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 20px;
    padding-bottom: 50px;
}

Also have some code that styles the table as a whole (don't think it would be relevant, but here it is):

.bottom-table {
    -moz-border-radius: 15px !important;
    border-radius: 15px !important;
    border: 2px solid black !important;
    width: 75%;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
}

Here is a JSFiddle with the relevant code: http://jsfiddle.net/zLyNm/

Upvotes: 0

Views: 1289

Answers (2)

Brange
Brange

Reputation: 111

Add vertical-align: top to .bottom-table td.

.bottom-table td {
padding-left: 10px;
padding-right: 10px;
padding-top: 20px;
padding-bottom: 50px;
vertical-align: top;
}

jsfiddle

Upvotes: 2

AsimRazaKhan
AsimRazaKhan

Reputation: 2202

you can use witdth property or can use margin or you can use colspan and rowspan property..

Upvotes: 0

Related Questions