I have some big issues with rendering tables.
I use this code to display a table:
<style type="text/css" media="screen">
body {
background-color: black;
}
.text_container {
position: absolute;
height: 80%;
width: 90%;
left:5%;
top: 10%;
display: table;
background-image: url('../images/box_leaderboard.png');
background-size: 100% 100%;
background-position: center;
background-repeat: no-repeat;
border: solid;
border-width: 2px;
}
.container_left_text {
display: table-row;
vertical-align: middle;
z-index: 0;
border: solid;
border-width: 2px;
}
.text_left {
display: table-column;
text-align: left;
font-size: 2em;
font-family: sansation-regular;
vertical-align: middle;
color: white;
padding-left: 1%;
width: 50%;
border: solid;
border-width: 2px;
}
.text_right {
display: table-column;
text-align: right;
font-size: 2em;
font-family: sansation-regular;
vertical-align: middle;
color: white;
padding-right: 2%;
width: 50%;
border: solid;
border-width: 2px;
}
</style>
<body>
<table class="text_container">
<tr></tr> <!-- Empty tr so we can hide all others -->
<tr class="container_left_text" id="parent0">
<td class="text_left" id="title0">Test
</td>
<td class="text_right" id="value0">Test
</td>
</tr>
<tr class="container_left_text" id="parent1">
<td class="text_left" id="title1">Test
</td>
<td class="text_right" id="value1">Test
</td>
</tr>
<tr class="container_left_text" id="parent2" >
<td class="text_left" id="title2">Test
</td>
<td class="text_right" id="value2">Test
</td>
</tr>
<tr class="container_left_text" id="parent3">
<td class="text_left" id="title3">Test
</td>
<td class="text_right" id="value3">Test
</td>
</tr>
</table>
</body>
It is rendered quite wrong in litebrowser with the latest litehtml code.
Besides that, if I resize the window ( re - render ), it looks like my <td> elements are moved down, so there is something being summed...
Also I noticed that in my implementation, if I added float: left and float: right properties to .text_left and .text_right respectively, the rendering would become extremely slow. I did not test this in litebrowser though.
I have some big issues with rendering tables.
I use this code to display a table:
It is rendered quite wrong in litebrowser with the latest litehtml code.
Besides that, if I resize the window ( re - render ), it looks like my
<td>elements are moved down, so there is something being summed...Also I noticed that in my implementation, if I added
float: leftandfloat: rightproperties to.text_leftand.text_rightrespectively, the rendering would become extremely slow. I did not test this in litebrowser though.