Hi. I just need to have a <td>texttttt <image> </td> but i need the image to align in the same horizontal position in every td
so i need that:
Textextextext IMAGE
textt IMAGE
to be like
Texttextet IMAGE
Text IMAGE
what i have
<style type="text/css"> .tg {border-collapse:collapse;border-spacing:0;} .tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;} .tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;} table td img { vertical-align: middle; display: inline-block; text-align: center; } </style> </head> -----etc <table style="width:50%; border:1px solid" class="tg"> <tr> <th colspan="2" bgcolor="#AE5454" style="font-weight:bold;"> -TOTAL ALL SITES : 19856 </th> </tr> <tr> <td style="width:50%;"> Myfirsttext </td> <td style="width:50%;" > 4264   <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> </td> </tr> <tr> <td style="width:50%;"> Mysecondtext </td> <td style="width:50%;" > 27074   <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> </td>
---etx
obviously   will go but i put it as a test here.
Thanks.
You can put the images in to another td like given below so that it will start at same point
<table style="width: 50%; border: 1px solid" class="tg"> <tr> <th colspan="2" bgcolor="#AE5454" style="font-weight: bold;"> -TOTAL ALL SITES : 19856 </th> </tr> <tr> <td style="width: 50%;"> Myfirsttext </td> <td style="width: 20%;"> 4264   </td> <td style="width: 30%;"> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> </td> </tr> <tr> <td style="width: 50%;"> Mysecondtext </td> <td style="width: 20%;"> 27074   </td> <td style="width: 30%;"> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> </td> </table>
Hi sapator,
Thanks for your post.
sapator
I just need to have a <td>texttttt <image> </td> but i need the image to align in the same horizontal position in every td
As for your problem, we could put contents and images in two block elements then make them float to left or right.
.content { display: block; width: 60px; float: left; } .imgs{ display:block; float:left; } <div> <table style="width: 50%; border: 1px solid" class="tg"> <tr> <th colspan="2" bgcolor="#AE5454" style="font-weight: bold;">-TOTAL ALL SITES : 19856 </th> </tr> <tr> <td style="width: 50%;">Myfirsttext </td> <td style="width: 50%;"><span class="content">4264</span>   <div class="imgs"> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> </div> </td> </tr> <tr> <td style="width: 50%;">Mysecondtext </td> <td style="width: 50%;"><span class="content">27074</span>   <div class="imgs"> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> <img src="image_temp/film_reel.png" alt="" height="12" width="12" /> </div> </td> </tr> </table> </div>
If you have any question about this issue, please post back freely.
Best Regards,
Fei Han
Hi sapator,
Although I agree with Mr.A2H, you need to modify your code as below,
<tr>
<th colspan="3" bgcolor="#AE5454" style="font-weight: bold;">
-TOTAL ALL SITES : 19856
</th><!--change the colspan into 3--> </tr>
Above code will merge the first row of cells to your requirements .
Best regards,
Aswecan
will have a look. I always used the 3rd td but i was hoping for a simple solution but i guess is ok if it work. However i would like NOT to show the vertical table lines so it would be
text image and not text | image .
I hope border =0 will do that?
Ok went with 3rd td but i also have an issues here, if you don’t mind taking a look
http://forums.asp.net/p/2014396/5797628.aspx?p=True&t=635496392152233661&pagenum=1