Results 1 to 8 of 8

Thread: [RESOLVED] align image in table after text.

  1. #1

    Thread Starter
    King of sapila
    Join Date
    Oct 2006
    Location
    Greece
    Posts
    6,597

    Resolved [RESOLVED] align image in table after text.

    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

    I have done alignment with 2 3rd <td> but i prefer to try it this way.

    what i have

    Code:
      <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 &nbsp <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 &nbsp <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>
    ---etc
    obviously &nbsp will go but i put it as a test here.

    Thanks.
    ἄνδρα μοι ἔννεπε, μοῦσα, πολύτροπον, ὃς μάλα πολλὰ
    πλάγχθη, ἐπεὶ Τροίης ἱερὸν πτολίεθρον ἔπερσεν·

  2. #2
    Frenzied Member tr333's Avatar
    Join Date
    Nov 2004
    Location
    /dev/st0
    Posts
    1,605

    Re: align image in table after text.

    I've put your sample html/css into a pen: http://codepen.io/anon/pen/wcLJI. Feel free to edit and save that pen to update the example.

    Maybe flexbox would work for you here?
    http://caniuse.com/#search=flexbox
    http://html5please.com/#flexbox
    CSS layout comes in to the 21st century with flexbox!
    Just another Perl hacker,

  3. #3

    Thread Starter
    King of sapila
    Join Date
    Oct 2006
    Location
    Greece
    Posts
    6,597

    Re: align image in table after text.

    I am not sure i can use that since this will be a simple html, imported in a string in VB and send to outlook.
    I was hoping for a simple solution but i think making a 3rd td is the only viable. :/
    ἄνδρα μοι ἔννεπε, μοῦσα, πολύτροπον, ὃς μάλα πολλὰ
    πλάγχθη, ἐπεὶ Τροίης ἱερὸν πτολίεθρον ἔπερσεν·

  4. #4

    Thread Starter
    King of sapila
    Join Date
    Oct 2006
    Location
    Greece
    Posts
    6,597

    Re: align image in table after text.

    Also i want not to show the vertical line between tezt and image:
    text image and not text | image .

    I hope border =0 will do that?
    ἄνδρα μοι ἔννεπε, μοῦσα, πολύτροπον, ὃς μάλα πολλὰ
    πλάγχθη, ἐπεὶ Τροίης ἱερὸν πτολίεθρον ἔπερσεν·

  5. #5
    Frenzied Member tr333's Avatar
    Join Date
    Nov 2004
    Location
    /dev/st0
    Posts
    1,605

    Re: align image in table after text.

    Last time I tried outlook, it's HTML support hadn't progressed much past the HTML of 1999. Not really sure that I can be of any help there. I would guess that border=0 might work on the table element, but inline CSS on the td might be a better option.

    https://developer.mozilla.org/en-US/...le#attr-border
    CSS layout comes in to the 21st century with flexbox!
    Just another Perl hacker,

  6. #6

    Thread Starter
    King of sapila
    Join Date
    Oct 2006
    Location
    Greece
    Posts
    6,597

    Re: align image in table after text.

    What about this?
    .tg td:nth-child(2){border-right:none}
    .tg td:nth-child(3){border-left:none}
    Is it viable?
    ἄνδρα μοι ἔννεπε, μοῦσα, πολύτροπον, ὃς μάλα πολλὰ
    πλάγχθη, ἐπεὶ Τροίης ἱερὸν πτολίεθρον ἔπερσεν·

  7. #7
    Frenzied Member tr333's Avatar
    Join Date
    Nov 2004
    Location
    /dev/st0
    Posts
    1,605

    Re: align image in table after text.

    http://caniuse.com/#search=nth-child

    You would have to test it out to see whether your version of outlook supports nth-child. You will have to use inline styles on each td element if it's not supported.
    CSS layout comes in to the 21st century with flexbox!
    Just another Perl hacker,

  8. #8

    Thread Starter
    King of sapila
    Join Date
    Oct 2006
    Location
    Greece
    Posts
    6,597

    Re: align image in table after text.

    Turns out i wouldn't be needing it but i remember to look for outlook issues next time.
    microsoft
    ἄνδρα μοι ἔννεπε, μοῦσα, πολύτροπον, ὃς μάλα πολλὰ
    πλάγχθη, ἐπεὶ Τροίης ἱερὸν πτολίεθρον ἔπερσεν·

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  



Click Here to Expand Forum to Full Width