I am a newbie creating a newsletter using tables and inline css, the problem is that i need to insert more than one image over an image(not background)... can anybody suggest me some possible solutions..

Breif :
1. I have inserted a background image
2. Then i inserted a image on it
3. Now i need to insert another image onto it

hw can this be solved O_o

Recommended Answers

All 5 Replies

You can change the location of the second image using position: relative and setting the left and top margins to the correct values so the images lie over each other (negative values are allowed). The z-index CSS attribute allows you to layer two elements over each other. The higher the z-index the more to the top the element is (i.e. a z-index of 10 will appear over an element with a z-index of 4).
So, if you had 2 images side by side on the page and wanted the right one over top of the left by 50px, the css would be

.firstImage {
   z-index: 50;
}
.secondImage {
   position: relative;
   margin-left: -50px;
   z-index: 100;
}

Newsletter dont support external css.. that is the prob i face.. if you have any other suggestion plz share it...

Thanks for the pre reply..Advance thanks for the post-reply

Newsletter dont support external css.. that is the prob i face.. if you have any other suggestion plz share it...

Thanks for the pre reply..Advance thanks for the post-reply

I would say you can't expect to do that and have it be compatible across all email clients. You shouldn't be using positioning, floats, etc. in email clients as many don't support them.

My $0.02

hericles didn't say to put it in an external css, you can add that in your head tag. and the z-index is the best way to do this.

Dark

I would say you can't expect to do that and have it be compatible across all email clients. You shouldn't be using positioning, floats, etc. in email clients as many don't support them.

My $0.02

i can understand it, but even that is not supported by gmail, and android. I have added a link to check the compatibilty.. check it.. so that you can have a better understanding of my situation http://www.campaignmonitor.com/css/

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.