CODEWITHSUNDEEP
htmlcsshtml-table
Dzhuneyt
Dzhuneyt

Reputation: 8701

Position Two Table TRs Side By Side

Whenever I try to absolutely position a TD inside a TR, the TD's top: and left: CSS properties align it with the page or the table as reference and not its direct parent (TR with position:relative set).

Here's my code. (notice the first TR is at the bottom of the result window due to this issue) I am trying to align the TD with the "Headline" text to take 50% of the row and the "Text" to take up the remaining 50%.

I realize this can be done by moving both elements inside a single TR and placing them in two TDs, but the HTML code is generated server-side in this case, so I am stuck to trying to achieve this via CSS. Basically, modifying the HTML code is not an option.

Upvotes: 0

Views: 9547

Answers (1)

GajendraSinghParihar
GajendraSinghParihar

Reputation: 9131

Use display:inline.

I just added table tr {display:inline} to your code and its done ;) demo Fiddle

But really For layouts tables are evil dont use them http://phrogz.net/css/WhyTablesAreBadForLayout.html

Upvotes: 3

Related Questions