Table align RIGHT within VML textbox???

Does anyone know how to align a table right within a VML textbox? Left and center work fine but Right seems to get ignored....

Heres and example of the code

<table width="600" border="0" cellpadding="0" cellspacing="0" align="center">
    <tr>
        <td bgcolor="#DDDDDD" style="background-image: url('http://i.imgur.com/XCnBXwP.png');" background="http://i.imgur.com/XCnBXwP.png" height="92" valign="top"><!--[if gte mso 9]>
  <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;height:92px;">
    <v:fill type="tile" src="http://i.imgur.com/XCnBXwP.png" color="#7bceeb" />
    <v:textbox inset="0,0,0,0">
  <![endif]-->

            <div>
                <table width="300" border="0" cellpadding="0" cellspacing="0" align="right">
                    <tr>
                        <td bgcolor="#FF00FF" align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:20px; font-weight:bold;"> | This is test text | </td>
                    </tr>
                </table>
            </div>

            <!--[if gte mso 9]>
    </v:textbox>
  </v:rect>
  <![endif]--></td>
    </tr>
</table>

Answers


Try setting your <div> to width:100%;. If that doesn't fix it, put a 100% width table in there, nest and align the child (your desired content) within that.

Example:

<table width="600" border="0" cellpadding="0" cellspacing="0" align="center">
    <tr>
        <td bgcolor="#DDDDDD" style="background-image: url('http://i.imgur.com/XCnBXwP.png');" background="http://i.imgur.com/XCnBXwP.png" height="92" valign="top"><!--[if gte mso 9]>
  <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;height:92px;">
    <v:fill type="tile" src="http://i.imgur.com/XCnBXwP.png" color="#7bceeb" />
    <v:textbox inset="0,0,0,0">
  <![endif]-->

            <div style="width:100%;">
              <table width="100%" border="0" cellpadding="0" cellspacing="0">
                <tr>
                  <td align="right">
                    <table width="300" border="0" cellpadding="0" cellspacing="0" align="right">
                        <tr>
                            <td bgcolor="#FF00FF" align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:20px; font-weight:bold;"> | This is test text | </td>
                        </tr>
                    </table>
                  </td>
                </tr>
              </table>
            </div>

            <!--[if gte mso 9]>
    </v:textbox>
  </v:rect>
  <![endif]--></td>
    </tr>
</table>

Sorry, late coming to the party...

you need an extra div with align="right" before you table & contents. VML textbox ignores align on tables for some reason.

<table width="600" border="0" cellpadding="0" cellspacing="0" align="center">
    <tr>
        <td bgcolor="#DDDDDD" style="background-image: url('http://i.imgur.com/XCnBXwP.png');" background="http://i.imgur.com/XCnBXwP.png" height="92" valign="top"><!--[if gte mso 9]>
        <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;height:92px;">
        <v:fill type="tile" src="http://i.imgur.com/XCnBXwP.png" color="#7bceeb" />
        <v:textbox inset="0,0,0,0">
        <![endif]-->

       <div>
            <div align="right">
                <table width="300" border="0" cellpadding="0" cellspacing="0" align="right">
                    <tr>
                        <td bgcolor="#FF00FF" align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:20px; font-weight:bold;"> | This is test text | </td>
                    </tr>
                </table>
            </div>
       </div>

      <!--[if gte mso 9]>
      </v:textbox>
      </v:rect>
      <![endif]-->
    </td>
  </tr>
</table>

And here is the link


Need Your Help

How to replace Collada-imported textures with ShaderMaterial ones in Three.js?

javascript webgl three.js collada

Is there a way to replace all textures in a simple 3D model imported via Collada loader in the Three.js library?