Forum Moderators: open

Message Too Old, No Replies

z-index positioning for MS Word html rendering (Outlook)

         

bikoalive

5:28 am on Feb 4, 2008 (gmt 0)

10+ Year Member



I am looking for a way for MS Word (as an Outlook message editor) to function z-index layers. I made an HTML with the following script. When I open with Word editor, the layer z-index does not function. It seems like MS Word does not directly use z-index but rather make <table> as a Text-box and let it use z-index. Of course, if I add the whole complex looking MS Word script, it will be available. But is there any simple way to manually add z-index layers to MS Word based HTML?

----- My script -------

<div style="position: relative; width: 600px; margin: 0 auto; text-align: left">

<div style="position: absolute; width: 600px; margin: 0 auto; text-align: left; z-index:1">
<img style="width: 600px; height:35px; margin: 0 auto; text-align: left;" border="0" src="abc.jpg">
</div>
<div style="font-size:11px; font-family: Arial; color:gold; position: absolute; top:10; right:15; width: 300px; margin: 0 auto; text-align: right; z-index:2">
testTESTtest
</div>

</div>

bill

8:19 am on Feb 4, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Welcome to WebmasterWorld bikoalive.

Word 2007 does not support z-index [msdn2.microsoft.com], and subsequently it won't render in Outlook 2007.

bikoalive

8:59 am on Feb 4, 2008 (gmt 0)

10+ Year Member



Thank you very much Bill. Do you think there is any workaround?

Trace

1:51 pm on Feb 4, 2008 (gmt 0)

10+ Year Member



Last week I was asked to integrate a fairly complex layout for an email blitz and ran into a few problems. Maybe this article will help you out as well. It lists all the do's and dont's.

[msdn2.microsoft.com...]

[edited by: Trace at 1:51 pm (utc) on Feb. 4, 2008]

phranque

10:36 pm on Feb 4, 2008 (gmt 0)

WebmasterWorld Administrator 10+ Year Member Top Contributors Of The Month



welcome to WebmasterWorld [webmasterworld.com], bikoalive!

bill

6:01 am on Feb 5, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Trace, isn't that the same article I linked to? ;)

Workaround? Maybe you just can't use source ordered code. If it's for e-mail, what's the benefit?

Trace

2:23 pm on Feb 5, 2008 (gmt 0)

10+ Year Member



Trace, isn't that the same article I linked to? ;)

Crud.
The worst part is I know I clicked your link too.

bikoalive, I think you need to need to have position:absolute to use a z-index property, and position is not supported in Outlook.

After all the headaches I went through to get my design just right in Outlook - I ended up using a table based layout. Old-school but it's what worked best.

bikoalive

3:12 pm on Feb 5, 2008 (gmt 0)

10+ Year Member



Hi Trace,

Yes I think I will use Table instead. Microsoft gives programmers so much headaches nowadays.