css repeat-y in HTML email
- Started
- Last post
- 13 Responses
- jysta
happy new year all!,
got an annoying prob with my HTML email. It displays ok in the browser but when I try and send it as a web page from safari to mac mail the 'background reapat-y images disappears' !!!!
Its wierd because it works ok on my local version but not the remote version. Iv styled the boxes as classes so maybe its the .blue_box thats throwing things out. Anyone else had this glitch and know a fix?
STYLE BELOW____
.blue_box {
color: #FFFFFF;
background-color: #72A1D2;
margin: 0px;
padding: 0px;
height: auto;
width: 344px;
position: relative;
background-image: url(images/grad_bg_02.jpg);
background-position: left;
background-repeat: repeat-y;
overflow: hidden;
}
- Crouwel0
what about checking that link?
shouldn't the image be enclosed, or at least be linked with the complete URL?
also, you must use inline styles and shit..
- digilee0
absolute that link dude!
url(images/grad_bg_0 2.jpg)
- Crouwel0
yeah that was sort of what i was trying to say, kind of, more or less..
- jysta0
thanks guys but arrrggg its not working :-( Iv tried re-referencing the image but it's still as if its not there!!
this image is there and referenced>
and the newsletter displays ok>
http://www.wickfordchiro.co.uk/n…
- version30
.blue_box {
color: #FFFFFF;
background-color: #72A1D2;
margin: 0px;
padding: 0px;
height: auto;
width: 344px;
position: relative;
background-image: url(http://www.wickfordchiro.co...
background-position: left;
background-repeat: repeat-y;
overflow: hidden;
}
- version30
or
.blue_box {
color: #FFFFFF;
background: #72A1D2 url(images/grad_bg_02.jpg) repeat-y left;
margin: 0px;
padding: 0px;
height: auto;
width: 344px;
position: relative;
overflow: hidden;
}give the complete url again if it's failing still, if not either of those, sorry :(
- doesnotexist0
dont you have to use absolute URL as in htt p://www.website.com/images/image... ?
- version30
agreed
- jersey40000
I think that the way your sending it from Safari to Mac Mail may be stripping out the bg image. Email clients are funky like that and with you deploying from a browser, it may be even funkier.
Here's some info on html email with CSS and it's results with Mac Mail = could be the issue (some email clients strip CSS)
- jysta0
yeah thanks guys, it's the mail prog. stripping out the bg image/ in css
Unavoidable.Iv just changed the design and made the blue boxes plain rather then applying shading.
The whole point of doing this as css/html rather then a load of picture boxes was so people could size the text larger or smaller.
I have since discovered overflow:hidden don't work well and IE is expanding boxes when u re-size.
any quick hacks/.
:-(
- jersey40000
I say keep it simple, if this is in fact, an email, why are you doing all this resize stuff? Keep it easy for email is what I say.
- stewart0
there's no gradient bg visible for me here
http://www.wickfordchiro.co.uk/n…
- radar0
you should write your html for emails like it is 2001 - so use tables, transparents gifs for spacing, and put absolutes sizes on cells, tables, etc. and always use absolute links - or thing will break everytime.
also it is good measure to host your images on the same website that is in the email addy you are sending from, some spam filters block images from different domains.